/    Sign up×
Community /Pin to ProfileBookmark

Inserting images into div’s

Copy linkTweet thisAlerts:
Aug 22.2010

I am trying to re-do a design on one of my sites to try and learn CSS better. Basically I am learning by reading a textbook/trial and error in addition to looking at CSS code on various sites.

Right now I am trying to insert a banner(image) into a div but it seems to be floating on top of everything and not sitting inside of the div. If I add a specific height to the div, it drops into place, but not all div’s are going to be the same height.

For an example, please view [url]http://www.funny-pranks.net/new/[/url] .

Any suggestions?

to post a comment
CSS

1 Comments(s) ↴

Copy linkTweet thisAlerts:
@Major_PayneAug 23.2010 — You can style the div and add the image inside with the image tag, or, you can set the image as the background of the div. Best to always tell the browsers what to do and provide the width/height for the div as well as the image. Basic example:

[CODE]div#banner {
width: XXpx;
height: YYpx;
margin: 0 auto; /* centers div */
background: url(path_to_image) no-repeat center scroll;
}[/CODE]
×

Success!

Help @StanleyJenkins spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.1,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...