[kwlug-disc] CSS help

Richard Weait richard at weait.com
Sun Mar 14 23:57:08 EDT 2010


On Sun, Mar 14, 2010 at 11:52 PM, Richard Weait <richard at weait.com> wrote:
> On Sun, Mar 14, 2010 at 8:07 PM, Chris Frey <cdfrey at foursquare.net> wrote:
>> Hi folks,
>>
>> I'm sure I'm making an elementary error, but I don't see it. :-)
>> I'm trying to get a layout like this:
>>
>>    +-------------------------------------------+
>>    | Entry Title                          Date |
>>    +-------------------------------------------+
>>    | Body text                                 |
>>    +-------------------------------------------+
>>
>> Here's my test case:
>>
>>        http://pages.netdirect.ca/~cdfrey/test.html
>>
>> As you can see, it's not quite working.  The header is there, but only
>> due to the padding I've given it.  The two divs inside the header
>> do not seem to be "inside" the header div.
>>
>> The CSS is embedded in the .html above.
>
> I've done this.  It was a bear.  Horizontal bar charts. They scale
> nicely when you change font size with ctrl-+. All css.
>
> Tougher to copy and paste, by way easier to read like this.

Until it wraps.  Ah well, it looked great if you were sitting at my
computer before I sent it.  Try again.

html
<div class="split">
  <div class="left">400nm</div>
  <div class="right">1400nm</div>
  <div class="spacer">log scale</div>
</div>

css
.split {width: 48em;} # set the total width
.left {float: left; text-align: left;} # left align stuff
.right {float: right; text-align: right;} # right align stuff
.spacer {text-align: center;} # and center the rest.




More information about the kwlug-disc mailing list