Do you have a question? Post it now! No Registration Necessary. Now with pictures!
- Posted on
- or CSS background-image?
October 2, 2006, 8:34 am
rate this thread
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? I'm not sure whether
to choose one or the other.
Related to that, suppose I do have a div that exists only to display a
background: url('banner.gif') no-repeat;
Is it OK to have an empty div in the HTML:
Or should I put a space in:
<div id="header"> </div>
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.
Thanks for looking!
Re: or CSS background-image?
Suppose that you gave us the URL. Then we would know what this is really
about and could give a simple, direct answer.
But the site _requires_ the images? So it's presumably unusable by anyone
who uses a text browser, speech browser, Braille device, or otherwise
imageless browsing. Right? I guess not.
The key question is: is it genuine content, or just decoration? Or something
between? Exactly where there?
If content, use <img> with adequate alt attributes. If decoration, use
background image _or_ <img> with alt=""; the choice between these depends on
the circumstances but isn't generally a big issue.
Too much width. Broken by design. Remarkably many web sites force horizontal
scrolling just because some dee-ziner decided on wide banner image.
Jukka K. Korpela ("Yucca")
Re: or CSS background-image?
The fact that you can place background images through CSS is no
indication that you ought to. The notion that you can apply CSS
rollovers to them isn't a good recommendation either.
CSS only supports "background" images, not foreground. The useful
behaviours that emerge from this (such as rollovers) don't change the
fact that it's primarily a background feature. It's definitely a
mistake to start treating this as a primary way of distributing real
content. Stick with <img>.
For one simple example, general default behaviour on printing is to not
print CSS background images. This is such a useful feature (because of
excess eye candy) that it's impractical to change this setting. So if
you want your images to be printable, then don't stick them through CSS
- » it's me, wendy. please visit our new free family site/blog at FAMSTER.COM everybody :) :)...
- — Previous thread in » HTML Markup Language
- » ssh on command line: force using a group size (prime size) of 1024 (and no...
- — The site's Newest Thread. Posted in » Secure Shell Forum