Posted by Ben C on 10/02/06 08:42

On 2006-10-02, JWL <user@example.net> wrote:
> Hi
>
> Suppose I have a site that requires a horizontal line of four images on
> each page. This is a design thing and doesn't really have much bearing
> on the site's content. The images differ from page to page.
>
> Anyway, using a CSS layout, I left-floated the four divs and placed
><img> tags in them to display the images. But now I'm thinking: would it
> be better to place background images in the divs using CSS? By using
> contextual selectors I could place exactly the same HTML on each page
> and have the CSS select the different images, which would make things
> much cleaner. Is there any reason not to do this?

Not that I know of.

> I'm not sure whether to choose one or the other.

If using CSS makes what you're doing cleaner, use that.

> Related to that, suppose I do have a div that exists only to display a
> background image:
>
> #header {
> width: 800px;
> height: 100px;
> background: url('banner.gif') no-repeat;
> }
>
> Is it OK to have an empty div in the HTML:
>
><div id="header"></div>

Yes.

> Or should I put a space in:
>
><div id="header"> </div>

It makes no difference if the div is whitespace: collapse (which is the
default).

> Looking at people's source, I've seen both techniques, but I don't
> know if it makes the blindest bit of difference to all the browsers
> I'm unable to test in.

Shouldn't do.

[Back to original message]