Liquid layout with max width?

Izi

Izi

Izi

Soldato
Joined
9 Dec 2007
Posts
2,718
My Google skills are failing me.

I am looking for a basic template which has a header and three columns which is liquid but with a set max width of 1500px (or whatever).

Anyone got any links / better Google skills than me?
 
I have a few minutes spare, so I knocked this up. :)

It's not perfect, and I don't know what you need it for, like it won't work if you need different width columns for instance, but if you need help, let me know and I can change that for you.

PHP: 
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<style type="text/css">
#container {
max-width: 1500px;
background: red;
}

#header {
height: 200px;
background: purple
}

#columnscontainer {}

.column {
width: 33.3%;
float:left;
height: 200px;
background: cyan;
}

.clear {
clear:both
}

</style>
</head>
	<body>
		<div id="container">
			<div id="header">Header</div>
			<div id="columnscontainer">
				<div class="column">Col 1</div>
				<div class="column">Col 2</div>
				<div class="column">Col 3</div>
				<div class="clear"></div>
			</div>
		</div>
	</body>
</html>

The thin line of red is because the columns are not perfectly fitting with 33.3% width each, a problem with any recurring number.
 
thanks, i was really referring to cross browser compatibility. Max - width in I.E 6 is not supported is it? I was seriously hungover yesterday, might re-try my googling skills!
 
You must log in or register to reply here.
Back
Top Bottom