CSS styling help needed
-
I'm hoping that to someone experienced this is a quick fix, but it may be a pain and a rat's nest of code.
Five or so years ago, I designed my brother's website at https://www.argentdata.com/index.html. I built it off of the Mollio theme (http://www.mollio.org/), and used templates in Dreamweaver, so it's not in a CMS. It's not a work of art, and there are some issues with it, but it's served him fairly well. Longer-term it needs a redesign, but right now I'm asking about just one aspect of the existing design.
There are two parts to the site - the plain HTML site, and the osCommerce store that's under the purchase tab. If you go to http://www.argentdata.com/catalog/ you'll see that the osCommerce store is full width, while the navigation header copied over from the main site is 1200 pixels wide and centered. If you're on a wide monitor, it looks weird.
What he'd like to do:
Make the main site align to the left, both the content and navigation, and make the navigation left aligned for the osCommerce portion. He figures this is the easier way to do things, rather than try to muck with osCommerce CSS (that also has some merged CSS from the Mollio theme) and get it to center.
Does anyone have a fairly simple solution that can make the navigation bar look good on osCommerce? Either the above of making everything left aligned, or some other solution simple we haven't thought of?
Thanks!
-
It looks like he did get what he wanted done for now. Thanks everyone!
-
Hi Keri,
Just wanted to check on this and make sure you got everything worked out.
Thanks!
Anthony
-
Thanks everyone! I'll forward this to my brother and see if that does the trick (then come back and mark helpful answers).
Keri
-
Totally forgot about the index updates! (Gotta learn to finish reading posts.)
Edit "argentdata.com/css/main.css" (changes in italics):
Line 107
#header #site-name a, #header #site-name a:link, #header #site-name a:visited,
#header #site-name a:hover, #header #site-name a:active {
text-decoration: none;
color: #CCC;
position: relative;
_ left: 100px; _}
Line 111
#nav {
font: bold 96% arial;
height: 2.09em;
margin: 0 105px 0 40px;
position: relative;
_left: 100px; _}
Line 151
#wrap {
min-width: 770px;
max-width:none !important;
margin: 0 auto;
position: relative; }
Line 152
#content-wrap {
position: relative;
max-width: 1200px;
_left: 100px; _}
This should match the root pages to the osCommerce pages.
-Anthony
-
Hi Keri,
This isn't a perfect fix but it should do the trick.
On line 377 of "argentdata.com/catalog/stylesheet.css" change
max-width: 1200px to max-width: none !important
#wrap {
min-width: 770px;
_max-width: none !important; _
margin: 0 auto;
position: relative;
}
You could also just delete the max-width value altogether, but just in case there's another width value somewhere else... might as well change it.
On line 348 add
position: relative; left: 100px;
#header #site-name a, #header #site-name a:link, #header #site-name a:visited,
#header #site-name a:hover, #header #site-name a:active {
text-decoration: none;
color: #CCC;
_position: relative; _
left: 100px;
}
Same thing on line 352... add** position: relative;left: 100px;**
#nav {
font: bold 96% arial;
height: 2.09em;
font: bold 96% arial;
margin: 0 105px 0 40px;
position: relative;
_ left: 100px;_
}
/* Hope this helps!
- Anthony */
-
Please view the attachment. Is that the result you desire? I am not entirely sure based on the question.
EDIT - actually, I prefer the 2nd image as a solution.
If you like the second image, simply change #wrap margin value to:
margin: 0;
Please note I am not a CSS expert by any means. I simply know enough to get by.
-
not waht you're asking for, but the fastest solution i can think of.
wrap the os commerce page with a div that is 90% width. give it margin: 0 auto; so that it centers. The tables inside should auto adjust because they are all set to be 100% width.
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Does too much inline CSS impact SEO rankings
Hello, Does implementing a lot of inline CSS have a negative impact on SEO rankings? I imagine it could affect page speed, but any other issues I might run in to?
Web Design | | STP_SEO1 -
Question Concerning HTML5/CSS Templates & Google Mobility Issues
Hi all, Looking for some kind of solution for a responsive update for a site and I am wondering if there are any templates (not Wordpress) that are both great SEO wise and would also pass muster with the impending Google update for responsiveness? I was looking at things like Canvas and Porto ( http://themeforest.net/popular_item/by_category?category=site-templates ) but can't find any discussion on whether or not these things have been addressed with any of these templates. If any of you have suggestions or other places to look for something that could possibly fit the bill (even if temporarily) I would be very appreciative. Thank you so much in advance!
Web Design | | Pixelwik1 -
Do I need to 301 redirect www.domain.com/index.html to www.domain.com/ ?
So, interestingly enough, the Moz crawler picked up my index.html file (homepage) and reported duplicate content, of course. But, Google hasn't seemed to index the www.domain.com/index.html version of my homepage, just the www.domain.com version. However, it looks like I do have links going specifically to www.domain.com/index.html and I want to make sure those are getting counted towards my overall domain strength. Is it necessary to 301 redirect in the scenario described above?
Web Design | | Small_Business_SEO0 -
Brainstorm for a Car Classifieds website. Would you guys mind help me brainstorm?
Hey Mozers... Would you guys mind help me brainstorm? My client contact me and he wants to build a car classified kind of website for Utah. He wants to make the website from scratch, he has a pretty good budget and plan on using online marketing together with traditional marketing. If you were building your own car classifieds sites and budget was not a problem what would you include in your site? (ex: responsive, native ios app, blog, free tool for tell the user the value their car, etc) How would you do the online marketing? Which car Classified site do you like? why? Thanks Felipe
Web Design | | Felip30 -
New more "helpful" internal linking causing SERP & traffic drop?
Still dealing with the weird traffic drop on my website. I have removed a bunch of old links from a defunct blog, 301 thin pages, added text to remaining pages. I'm still stumped. So awhile ago I freshened up my website and thought I was "helping people" by making sure they could CONTACT the studio more easily... I added more links to the "contact page" I thought this would help conversions...This changed the number of links to my entire site....Would this be the problem with my ranking/traffic drop? http://bayareaboudoir.com/babinternal1.pdf
Web Design | | Squee1 -
301 redirect on Windows IIS. HELP! (Part 2)
My webmaster's trying (but struggling) to 301-redirect the non.www version of my site to the www version. He's following these instructions given to me in a response to an SEOMoz Private Question (ah, the good old days!). So far he's 301-redirected the homepage but seems stuck on how to do the entire site. Any clues on what he should be doing?
Web Design | | Jeepster0 -
WordPress blog hosted on GoDaddy domain mapping help
We set up a WP blog that's hosted through GoDaddy. For various reasons, we purchased a URL to use to get through the technical build and set up and are trying to map that to a subdomain of our company website. (We can't host it on our own server, unfortunately). My question is: for WP blogs hosted via WP you can buy a domain mapping upgrade and I'm trying to find a similar plugin that could offer the same thing that would apply to our GoDaddy hosting and point to our subdomain (GD apparently doesn't offer the domain mapping). Anyone have any thoughts, please?
Web Design | | josh-riley0 -
Need advice on diplaying content for Search
Hi every body, I am doing landing page redesign(s). Does any body know or can refer a content carousel that can rotate video and pictures? The "site with images" search option result is a compelling reason to showcase pictures if your space competeiveness (showroom, merchandise, etc) can be improved with a strong image presence. here is my main landing page http://www.shearerpainting.com I know there is alot of stuff, and confusing call to action, but I am looking for strategies to clean it up, clear fous on action (get bid, learn more), but allow users to see that they can dig for more content.
Web Design | | johnshearer0