/    Sign up×
Community /Pin to ProfileBookmark

100% height in nested DIV

Copy linkTweet thisAlerts:
Jul 22.2006

Hi guys,

I’m trying to make a bordered box using individual div fragments. Everything looks good so far except I can’t figure out how to make the .boxMid height expand to 100% of the container div height (see attachment). The boxMid class is currently set to 100% height, but it’s pushing the bottom border down. What I really need is a height in percentage that is equal to the height of the container div – 20 pixels (to account for the top and bottom borders).

Any ideas?

Thanks,
Tom

[upl-file uuid=29900c91-d7fd-459a-9e5a-041f5db9d370 size=533B]css_box.zip[/upl-file]

to post a comment
CSS

1 Comments(s) ↴

Copy linkTweet thisAlerts:
@10basetomauthorJul 22.2006 — After playing around with it a little more I finally got it to work! The solution is to add this to the the boxMid class to account for the top and bottom borders, which are 10 pixels high each:

<i>
</i> margin-bottom: -20px;


I hope this will save some of you time (and hair) if you've ever wanted to do something similar.

Tom
×

Success!

Help @10basetom 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.16,
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: @nearjob,
tipped: article
amount: 1000 SATS,

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

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