[thelist] RE: Site check: www.rspb.org.uk

Rob Whitener rwhitener at DesignOptions.com
Thu Feb 6 08:42:01 CST 2003


Thanks, and good luck with the site.

Rob

-----Original Message-----
From: Bird, Graham [mailto:Graham.Bird at rspb.org.uk]
Sent: Thursday, February 06, 2003 9:41 AM
To: 'thelist at lists.evolt.org'
Subject: RE: [thelist] RE: Site check: www.rspb.org.uk


Hi Rob,

Thanks for the comments.

> Nice site,  I looked at it in Opera 6.2.3 and it seems that the
> "International" menu button at the top is broken into two pieces with the
> larger piece placed just under the "birds" and "gardens" buttons.  I
didn't
> get a chance to look at every single page, but that is the only thing that
I
> can see.

This happens on Opera 5 and 6 but works as it should in 7. It's as if it is
wrapping to two lines, but I can't figure out why so I left it. There are
one or two other Opera issues (that go away in 7) which I'm hoping to tackle
when I get round to it.

> I have seen similar layouts on many web pages, where content seems to
> be separated up into boxes.  I think it looks very stylish and clean.  I
am
> wondering how this is accomplished.

It can be done with CSS by adding the border property to block level
elements (e.g. h1, ul, div, p).

For example, some boxes on the site are ul lists topped with an h1 or h2
tag. Surround the h1 tag with the top half of the box, and the ul with the
bottom half. Then pad the box out (so the content doesn't touch the edges)
with the CSS padding property.

The CSS for something similar could be:

h1 {
margin: 0;
padding: 6px;
border-style: solid;
border-width: 1px 1px 0 1px;
border-color: #999999;
}

p {
margin: 0;
padding: 6px;
border-style: solid;
border-width: 0 1px 1px 1px;
border-color: #999999;
}

Then the HTML would be:

<h1>My box</h1>
<p>Box content</p>

Cheers,

Graham
--
* * Please support the community that supports you.  * *
http://evolt.org/help_support_evolt/

For unsubscribe and other options, including the Tip Harvester
and archives of thelist go to: http://lists.evolt.org
Workers of the Web, evolt !



More information about the thelist mailing list