Reputation: 30188
I have have a 3 column layout inside of a wrapper. The left and right columns have a fixed width: 180px. The center column is fluid between 640px and 960px. I'm using the calc method to calculate its width:
width: calc(100% - 360px);
max-width: 960px;
min-width: 640px;
But what I can't figure out is the CSS for the wrapper. How do I get the whole 3 column layout to align itself in the center of the browser?
Upvotes: 0
Views: 163
Reputation: 38262
You can do it this way:
#wrapper {
margin:auto;
max-width:1320px; /*960 + 360*/;
min-width:1000px; /*640 + 360*/;
}
Check this demo http://jsfiddle.net/VTX4q/10/
I change the dimensions for a better visualization but is the base of what you can do just with your own values
Upvotes: 1