Have you tried something like this:
<div id="wrapper">
<div class="left"><h2>Left Heading </h2>
<p>This is an ordinary text</p>
</div>
<div class="middle"><h2>Middle Column </h2>
<p>This is another ordinary text</p>
</div>
<div class="right"><h2>right Stuff </h2>
<p>This is yet another ordinary text</p>
</div>
</div>
and the styles to go with it:
body {
margin: 0;
padding: 0;
width: 100%;
text-align: center;
}
#wrapper {
text-align: left;
margin: 0 auto;
width: 960px;
}
.left {
min-width: 30%;
float:left;
border: thin green solid;
}
.middle {
min-width: 35%;
float:left;
border: thin green solid;
}
.right {
width: 30%;
float: left;
border: thin green solid;
}
h2 {
text-align: center;
}
p {
text-align: left;
}
> I have a three-column (fixed width) layout which requires a heading in
> each column. The lengths of the headings may vary. I am trying to centre
> each heading using 'margin: 0 auto 0;', but can't make it work unless I
> set a specific width on the heading. This leaves two of them off-centre
> as some are longer than others.
>
> What is the best way to deal with this, please ?
>
> I could set an individual specific width on each heading, of course, but
> that's inflexible and hard to maintain.
>
> My column widths are set as % of a fixed width container whose width is
> declared in pixels. The pages are in an early stage of development and
> not yet publicly available.
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
