Setting Images using CSS

[ToshTrent]

Hey all,

My latest project is to make my site more maintainable. So I’ve decided to move towards DIV tags and CSS. Seems to be going smoothly at the moment, however I’ve been running into a problem with setting images using CSS.

I would like to set the header image, menu items, next/previous buttons using CSS so when I change the style in a year or so I can simply update the CSS and all is done.

How can I set images of a DIV using CSS?
- Is the only method to set background image url in CSS?

Thanks

Tosh

 

[Foamcow]

How can I set images of a DIV using CSS?
- Is the only method to set background image url in CSS?

Yes. Images for decoration can be done via CSS using backgrounds etc.
Images that relate to content are just that, content and so should be handled via the markup (HTML).



Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK

 

[BillyRayPreachersSon]

How can I set images of a DIV

DIV elements do not "have images". You either place a background image on an element using CSS, or you have an IMG element on the page.

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[Vragabond]

Yup, the only method that would work cross-browser at the moment is applying background images to elements in CSS. So it should usually be ok with decorative graphics but shouldn't be there for actually content graphics like next/previous buttons.

 

[ToshTrent]

Ok thanks for the help lads.

So with regard to structuring the site what would be the most recommended method so that updating is of ease concerned with the images still. At the moment it can take a fair while to ensure the site is updated quickly.

[red]
Thankyou[/red]
Matt

 

[Foamcow]

Depends on what sort of updating you need to do.

If you need to regularly change a picture on multiple pages then use a placeholder filename and simply replace the file with a different pic with the same filename.

Create a code snippet with the image HTML in it and include it in your pages with SSI, PHP etc. Then you only need change 1 file to change the image globally.

But like I said, it depends on the exact cirtumstances and what you actually want to change.

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK

 

[ToshTrent]

What you said there seems to be what i need to do, just making sure that was a known practise and not some dodgy method. Thanks mate.