/    Sign up×
Community /Pin to ProfileBookmark

position an image over other div elements

Hi

please look at the attached

[url]http://www.joewalkden.co.uk/layout3[/url]

I’ve been trying to position an image in the top right corner but it always appears underneath the two lines of text I have in my header div. What’s the way around this?

thanks!

to post a comment
CSS

5 Comments(s)

Copy linkTweet thisAlerts:
@ray326Aug 20.2005 — Give your paragraphs a width so they don't take up the whole space then float the image right. Those paragraphs should probably be an h1 anyway, at least the first one.
Copy linkTweet thisAlerts:
@armadillo1111authorAug 22.2005 — thanks, I must still be missing something.

www.joewalkden.co.uk/layout3b

Any suggestions?
Copy linkTweet thisAlerts:
@NogDogAug 23.2005 — I'd suggest getting rid of some of the DIVs that are not really needed, then set the image as a background to the header DIV.

CSS:
<i>
</i>#header{
color: #FFFFFF;
margin: 0;
padding: 5px 0 0 0;
height: 110px;
background: #000000 url("1redbox.jpg") no-repeat 100% 50%;
}

#header h1 {
margin: 30px 0 0 20px;
}

#header h2 {
margin: 0 0 0 40px;
}


HTML:
<i>
</i>&lt;div id="header"&gt;
&lt;h1&gt;joewalkden.co.uk&lt;/h1&gt;
&lt;h2&gt;came to London for a month in January&lt;/h2&gt;
&lt;/div&gt;

Makes the markup a lot easier to read - and therefor update - too. ?
Copy linkTweet thisAlerts:
@armadillo1111authorAug 23.2005 — Great, that worked perfectly.

So when you define the div as #header h1 for example, does the text in that div then inherit the specific h1 properties from the "header" div, in addition to any other h1 properties that may be specified elsewhere in the style sheet?

thanks
Copy linkTweet thisAlerts:
@NogDogAug 23.2005 — "#header h1" means to assign the following attributes to any H1 element contained within the element whose ID="header".
×

Success!

Help @armadillo1111 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 5.28,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

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

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...