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
-
Need An Honest Opinion Of My Design
Just looking to get an honest opinion on my website design for my scuba diving client. Trying to decrease bounce rate and have seen some results from tweaking design. Honest opinions appreciated. Recommendations appreciated even more 😉
Web Design | | InfinityTechnologySolutions0 -
Google HTML, CSS and javascript styleguides ?
Who's following the Google style guides especially in HTML, CSS and javascript? What are the benefits of following the style guides? I am thinking of sending the style guides to our web development team before we launch our new site but I think there might be some conflicts. I'm an SEO and not programmer or web developer and I'm sure there are some "rules" that these web dev guys should follow and break as well. Thanks in advance! 🙂
Web Design | | esiow20130 -
Can you use a base element and mod_rewrite to alleviate the need for absolute URLs?
This is a follow up question to Scott Parsons' question about using absolute versus relative URLs when linking internally. Andy King makes the statement that this can be done and that it saves additional space (which he claims then can improve page speed). Is this a true and accurate statement? Can using a base element and mod-rewrite alleviate the need for absolute URLs? I need to know before going off on a "change all of our relative URLs to absolutes" campaign. Thanks in advance! Dana
Web Design | | danatanseo0 -
Keyword help for a beginner
Hello Everyone! I have a few simple questions about picking/using the best keywords for my website. Just to give a little background on the company, we sell branded servers (IBM, HP, DELL) workstations, storage, and related hardware and software (memory, processors, hard drives, operating systems, management software, etc...) I'm trying to pick the keywords to use on the home page but have these questions: 1. This question is a little hard for me to explain, but we would like to show up in the search results whether a user types in: Dell server(s) or IBM server(s) or HP Workstation so for the title tag can we use: DELL, IBM, HP Servers, Workstations, Storage or we need to use DELL Servers, IBM Servers, Dell Workstations, IBM Workstations, etc... Basically what I'm asking is can we combine keywords in the title tag or we need to write them out (hope this make sense) if not let me know and I'll try provide a little more detail and few more examples. 2. This question might not fall under this category of topics and might have to start a new thread but here it goes. We are re-designing our site on a new eCommerce platform using x-cart shopping cart, its a very configurable and inexpensive shopping cart however one of the drawbacks is its speed. Most users of the x-cart shopping cart software report on average of 2-4 seconds page loads, which is kind of slow. even with some heavy optimization you get about 1.5 - 2.5 seconds page load. I've heard that if you want to be higher in Google's search results speed is a big plus, being in the 0.5 second range is a huge plus. I was thinking of creating a static html home page that would include some company info, content with relevant keywords, some links to main categories... (basically kind of copy the google.com page but with a little more text) Would that be a good idea to implement? Hope this question makes sense as well or stick with the default shopping cart home page and try to optimize it as best as possible? 3. We probably have about 10 - 15 short keyword phrases that we want to concentrate on, again they would be:
Web Design | | igor.pinchevskiy
DELL Servers, HP Servers, IBM, Servers
DELL Workstations, HP Workstations, IBM Workstations,
DELL Memory, HP Memory, IBM Memory
DELL Hard Drives, HP Hard Drives, IBM Hard Drives What is the maximum or recommended quantity of keyword phrases to try to include on the home page? Is it also recommended to maybe create a separate page for each keyword phrase? Does a home page get better ranking then another page on the server just because its a home page? Hope my questions aren't too dumb and make sense. I appreciate everyone who takes their time to read through and answer my questions or guide me in the right path. Thank you,
Igor Pinchevskiy0 -
Is my sitemap going to help me attract more visitors?
Hi, As I await my sitemap to go live, can someone tell me the main benefits of it? A Google sitemap that is .xml one. I have a images sitemap also as the site is an e-commerce store. Should I be expecting to see an increase in visitors when I implement it initially? Thanks Will
Web Design | | WillBlackburn0 -
Optimzing a new ecommerce site, Need help with URL
Hi We are putting up a new ecommerce website and for product description, our tech team indicates that they must have the skun numbers in the URL. Which one of the following URL structure do you find the most SEO freindly? 1. http://www.Site.com/SKUNumber/ProductDescription/ or 2. http://www.Site.com/ProductDescription/SKUNumber/ My personal opinion is that most relevant content should be on load page so I like option 1. Thanks
Web Design | | CookingCom0 -
Ecommerce Style Wordpress But No Shopping Cart.
Wondering if anyone knows if you can purchase an ecommece style wordpress theme, but not use the shopping cart portion or display pricing. We would like to display our website how an ecommerce is set up, but at this time, we do not sell anything online. We are considering in the near future to sell half of our products. And this would not be very large. Or can ecommerce be added to any wordpress theme. ?
Web Design | | hfranz0 -
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