CODEWITHSUNDEEP
css
REDFOX
REDFOX

Reputation: 171

How to: height child gives same height parent ...?

What to do to get a height for nav the same as height (padding) of nav li a ... !?

nav {
    width: 100%;
}
nav ul {
    text-align: center;
    background-color: #000;
}
nav ul li {
    display: inline;
    margin-right: 0.8em;
    font-family:"courier new"; courier; sans-serif;
    font-size: 1.4em;
}
nav ul li a {
    outline: none;
    color: #fff;
    text-decoration: none;
    padding: 1em 0.5em;
}
nav ul li a:hover {
    outline: none;
    text-decoration:none;
    background-color: #bf2e1f;
}

Fiddle > http://jsfiddle.net/redfox52/HbrkA/

Thanks!

Upvotes: 1

Views: 145

Answers (2)

REDFOX
REDFOX

Reputation: 171

Oops, of course ...

nav { overflow: auto; }

will do the trick too ... which kind of padding (also padding-bottom) on a ... height nav will follow ... :)

Thanks all for helping me!

Upvotes: 0

nice ass
nice ass

Reputation: 16709

The top/bottom padding on the links should be 0:

padding: 0 0.5em

If you want to add padding to the links, make them block elements (example).

Upvotes: 1

Related Questions