/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Can’t Position Text/Div on bottom!

No matter how many ways I’ve tried, I can’t get my text (which is placed inside a div tag placed inside another div tag) to show up on the bottom. I need it to be on the bottom without having to adjust margins when the lines of text change.

current code:

[CODE]
echo ‘<a href=”‘.$row[‘url’].'”><div style=”position: relative; background-image:url(./data/flashrotation/’.$row[‘FRID’].’_beta.jpg); background-repeat:no-repeat; width:536px; height:370px; ” class=”panel”></a>’;

echo ‘<div style=”height:auto; width:100%; position:absolute; top:0; left:0; right:0; bottom:0; color:#fff; background: rgba(0, 0, 0, 0.5); background-opacity:0.6;padding-right:5px; padding-left:5px; padding-top:5px; padding-bottom:5px; border:10px;”>’;

echo ‘<span style=”font-family:copperplate gothic bold”>Text Goes Here</span>’;

echo ‘</div>’;[/CODE]

echo ‘</div>’;

I’ve tried as many ways I could find on the internet, and none have worked.

Essentiall, I need my end result to be a transparent news box over a flash rotation photo (hence the code). ESPN.com has exactly what I need, but still no good.

Any ideas would be AWESOME!

Thanks guys!

to post a comment
CSS

4 Comments(s)

Copy linkTweet thisAlerts:
@toicontienFeb 22.2010 — The basic idea:
[CODE]<div style="position: relative;">
<div style="position: absolute; bottom: 0; left: 0; width: 100&#37;;">
Some text goes here
</div>
</div>[/CODE]
Copy linkTweet thisAlerts:
@expphotoauthorFeb 23.2010 — See, I tried that. didn't work. I ended up having to do fixed margins within the divider. I couldn't get it to go ot the bottom any other way.

Any other ideas?
Copy linkTweet thisAlerts:
@toicontienFeb 24.2010 — If my suggestion didn't work, then something else is afoot. Can you please post the HTML that PHP renders? Let's start there.
Copy linkTweet thisAlerts:
@expphotoauthorMar 03.2010 — If my suggestion didn't work, then something else is afoot. Can you please post the HTML that PHP renders? Let's start there.[/QUOTE]

Sorry for the late response. We just gave in and used fixed positioning. :-/
×

Success!

Help @expphoto 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.11,
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,
)...