Hi everyone... I'm trying to get my head around liquid layouts and want to achieve a look similar to http://www.pfdfoods.com.au/ in terms of the content DIV being in the middle along with a menu. I also have to get the DIV containing the menu to be of equal height to the one displaying the content... Does anyone know a link to such a template? I've been Googling for ages. Or perhaps someone could please throw something together quickly in Dreamweaver?? I want to have a gradient-style background behind that central <DIV> so everything is centred and attractive. So I need to know how to do that too ... a wrapper, yeah? This is what I'm looking for: http://img269.imageshack.us/img269/5332/layoutauv.jpg. And the footer should continue the background across... Thanks in advance. This is annoying me so much
HTML: <html> <head> <style> body { background: url(ah.png) #004684 50% top repeat-x; } #main { position: absolute; left: 50%; margin-left: -400px; width: 800px; } #menu { width: 200px; float: left; background-color: white; } #content { width: 600px; float: right; background-color: orange; } #footer { background-color: gray; } </style> </head> <body> <div id="main"> <div> <div id="menu">Menu</div> <div id="content">Content</div> </div> <div id="footer">Footer</div> </div> </body> </html> ah.png is this image: The final result should look like this: Note: Its been about 2 years since I did web development so you may need to check if the CSS attribs are actually compliant and if it works across browsers.
lol... Thanks. But I only tested the above on FF 3.5. Not so bravo-ish. Anyone else can comment if its correct, that'll be helpful for the OP
Wow, thanks. I'll try that out tomorrow as I'm just about to head to bed [and thought I'd check in here first] but looks perfect. Cheers!
