Hi, for the past few weeks ive been racking my brains trying to figure out a way to do this for SEO reasons - it's a little tricky to explain but here goes: I'm just creating a new site design for my website - In general i've got two divs - the first at the top that holds a 'header', 'menu' & another one for graphics, then theres the main div underneath that hold's the h1 tag and text. Im trying to switch the two around in css so that in the code the h1 & text is at the top? Is there a way to do this - the only way i can think is to 'position: absolute;' the bottom div and 'margin-top' the top - however this isn't feasible for what i need. Also floating the two divs doesnt work either ... I hope you understand what im trying to do ... Thanks
well i suppose i could, but i dont want to because i've got a jquery sliding down div that shows a quick contact form, if the div is absolutely positioned it won't work. thanks
I´m not sure what you mean, but do you mean in the html code you wanna change places? In that case just put the content first and then the rest. <div id="container"> <div id="maincontent"> </div> <div id="header"> </div> <div id="menu"> </div> I´m not sure if this is what your looking for?
In a summary, i want to have two divs one called 'top' holding the menu, header etc ... and one called 'bottom' holding the h1 and text. In the html i want to have the 'bottom' div with the h1 + text at the top, but in the browser using css switch the two around ... Sorry it's really hard to explain
Ayup, I know exactly what you're asking.. and without your header div being the same height every time, you can't use absolute positioning. If your header/menu div IS the same height on every page then you CAN. Instead, if this is purely for SEO, keep the current order (top then content+h1) and just have a skip link going to an ID on either the H1 or maybe the box holding the content. Have the skip link in the header, first thing after the name of the site. Both the blind and teh googlies have the option of clicking it to go directly to the content. Leaving this as an OPTION ensures that your content doesn't stop visitors or teh googlies from missing your navigation too. Deathshadow once did a real complicated trick to do what you want... something having to do with setting the first thing 100% high I think and then the second div (the content) set to top: 100% or something... I forget exactly, and it was real picky on how it worked. You might find it in the search under both HTML and CSS forums here at DP with top: 100% and "deathshadow"....
Your a diamond - thanks for that - I think i may have to keep it like you said - Ive already got a 'SKIP TO CONTENT' link in the header so that's good. I may look into the 100% you were talking about but if it's too complicated then i dont think i'll bother. Thanks again Stomme poes