Forum Moderators: not2easy
I am relatively new to css for seo, and I have a page where I have the content div first in the code of the page, followed by left bar (the nav div), right bar, then the footer, then the header. I want to position these divs for the layout, but I am having some trouble.
This is a 3 column layout, but inside a fixed width "holder/wrapper" div of 760 pixels wide that is centered horizontally on the page. I would like it behave like the previous table version. So when someone resizes the browser window, it stays centered (up to a certain amount of resizing).
Should I position the divs absolutely or relatively?
Then... you could position your header and content in the normal flow of the page. Your content could have 'massive' left and right margins to allow room for your left and right bars which you could position absolutely in the margins of your content block...?
I did place the "content" div which contain the H1 tags first on the page. So in the code, that is first, followed by the next most keyword laden div, and so on. Again, this is a static 3 column layout contained in a wrapper div. I am sure it is an easy fix, I am just new to laying out sites with only divs.
I can get the wrapper, header (which only contains the logo), left bar (which is the navigation buttons) and content div (with h1 and content) placed, but I am having issues getting the right bar to place as well as the footer. I need the right bar to be 90 pixels from the top, but floated right, which when you position absolutely, it doesnt stay within the wrapper.
I can post my code if this isnt clear.
Thanks for your help.
John
I need the right bar to be 90 pixels from the top, but floated right, which when you position absolutely, it doesnt stay within the wrapper.
If the wrapper is
position:relativethen any absolutely positioned elements within this wrapper will be positioned relative to your wrapper. So, (0,0) will be the top left corner of the wrapper, not the page.
...the footer
Are you 'clearing' your floats and allowing the footer to flow in the page below the content? Or are you trying to position it somehow? Maybe a code snippet will help here...