- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hey Guys. Bit of a head-scratcher here.
I am trying to add an underline to the ‘current’ page item in the nav menu here: http://iamshawnrice.com/demo/jlross/?page_id=102#.UKKkU-Q8CSo
My Code:
#top-menu ul.nav li {
padding: 0;
float: left;
width: 20%;
font-family: ‘LeagueGothicRegular’, ‘Goudy Bookletter 1911’, arial, sans-serif;
text-transform: uppercase;
text-align: center;
}
#top-menu ul.nav li a {
font-size: 24px;
color: #555;
text-decoration: none;
text-shadow: 0 1px 1px rgba(176, 176, 176, .5);
-webkit-transition: all .5s ease-in-out;
padding-bottom: 0px;
width: 100%;
}
#top-menu > ul > li.current-menu-item > a {
font-family: inherit;
color: #333 !important;
font-style: normal !important;
border-bottom: 2px solid #333;
}
I need the
#top-menu ul.nav li a
item to not be 100% width, but to be centered in it’s parent container.
Any thoughts?
Do you mean that the link (a) should be say 80% width of the li with 10% margin on either side?
Like this: http://codepen.io/anon/pen/zyhre
Remove float:left;
and display:block;
from .nav a
(styles.css, line 344).
GENIUS!
Thanks, Senff.