-
Some basic margin / centering help
I am using one of the Fluid-Fixed-Fluid layouts from this site (http://www.dynamicdrive.com/style/la...d-fixed-fluid/). Running into a problem with the margins/centering and hoping there's an easy fix to this.
See this:
http://www.newton-designs.com/icpixx...ixed-fluid.htm
On my (standard size) monitor, everything looks peachy. However if you view on a larger monitor, my layout is all out of whack. All I want is for the fixed-width centerwell (white) to be centered, with EQUAL size grey columns flanking it (grey columns being equal to each other... and liquid). Obviously I mistakenly set this up for proper viewing only with my own monitor specs, but need it more universal.
I know the secret lies in the margins. How do I fix this?!
Thank you in advance for any help you can give.
#contentwrapper{
float: left;
width: 100%;
margin-left: -13%; /*Set left margin to -(RightColumnWidth)*/
}
#leftcolumn{
margin: 0 760px 0 13%; /*Set margin to 0 (contentWidth) 0 (RightColumnWidth)*/
background: #666666;
}
#content{
float: left;
width: 760px; /*Width of left column in pixels*/
margin-left: -760px; /*Set left margin to -(contentWidth)*/
background: #FFFFFF;
}
#innertube{
padding:15px
}
#rightcolumn{
float: left;
width: 13%; /*Width of right column in percentage*/
background: #666666;
}
-
-
[quote]
#contentwrapper{
float: left;
width: 100%;
margin-left: -13%; /*Set left margin to -(RightColumnWidth)*/
}
[quote]
change the blue to whatever width you want, however be aware of your audience... just because you have a certain resolution doesn't mean that everyone has that 
and in the future please use [code][/code] when posting computer code
its formatted in a way that's easier for us "helpers" to debug and review
-
Thanks boogyman... and sorry about the missing [code] tags... I will remember those next time 
So I tried your fix, but that doesn't help unfortunately. As it is, I am using the fluid-fixed-fluid suggested layout but my content is actually going in the middle (fixed) column and the side ones (both fluid) will be empty. As a result, I am probably unnecessarily using the contentwrapper div, but not sure how to get rid of that (I am new to CSS).
All I am looking to do is have a centered, fixed-width centerwell and then have those side columns be a solid color, empty of content, and equal widths to each other, filling the screen to the edges. There must be an easier way!
Any additional help is much appreciated. Thanks.
-
-
search google for "faux columns"
-
I think..... I finally have a solution. Thanks again boogyman.
-
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
Bookmarks