Forums

melz

Hi,
I've finally decided to cut lose the tables and move on to pure CSS layouts. Unfortunately, it's been a real pain. I've read book after book, visited numerous sites and well... now I'm confused and overwhelmed.

"The perfect fluid layout" is exactly what I'm looking for, but I need help with just one thing. I need to add another fluid column into the layout - fluid, fluid and fixed. I can't seem to wrap my head around it.

I would greatly appreciate any advice or suggestions!

Thanks!

chriscoyier

If you need to go Fluid-Fluid-Fixed, this is how I would do it:

http://css-tricks.com/examples/FluidFluidFixed/

HTML:

<div id=\"page-wrap\">
		
	<div id=\"fixed-container\">
		... stuff ...
	</div>
		
	<div id=\"fluid-containers\">
		<div class=\"fluid-container\">
			... stuff ...
		</div>
		<div class=\"fluid-container\">
			... stuff ...
		</div>
	</div>
</div>

CSS:

#page-wrap {
	min-width: 600px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 30px;
}
#fixed-container {
	width: 250px;
	float: right;
}
#fluid-containers {
	padding-right: 260px;
	}
	.fluid-container {
		width: 47%;
		float: left;
		padding-right: 10px;
	}

melz

It's perfect, I honestly can't thank you enough! Amazingly you just cured two days of pure and unadulterated frustration!

Thanks again!

treehouse : what would you like to learn today?

Forums

Layout issues and questions