CSS selectors on custom navigation -
the context: working on project requires coding custom tumblr theme using html, css, , jquery. website i'm building out features "newsfeed" of auto-generated content pulled in , auto-posted tumblr iftt sequences have monitoring rss , social feeds. backend program automatically tags posts source type, have set redirect pages in theme's navigation navigate content tagged each source type. want set css selectors style hover , active navigation links, , have followed lvha rule , tried specifying class , id, can't work. want hover , active navigation categories set bold, instead of italic (link , visited setting).
the ask: taking peek @ my code a.nav1 links, how can set css :active , css:hover text-decoration: bold?
thanks much!! pointers appreciated. hannah
my current code is:
a.nav1:link { color: black; margin: auto; width: 130%; margin-bottom: 0px; padding-bottom: 0px; font-style: italic; -webkit-transition: 1s ease-out; -moz-transition: 1s ease-out; -o-transition: 1s ease-out; -ms-transition: 1s ease-out; transition: 1s ease-out; } a.nav1:visited { color: black; margin: auto; width: 130%; margin-bottom: 0px; padding-bottom: 0px; font-style: italic; -webkit-transition: 1s ease-out; -moz-transition: 1s ease-out; -o-transition: 1s ease-out; -ms-transition: 1s ease-out; transition: 1s ease-out; } a.nav1:hover { color: black; margin: auto; width: 130%; margin-bottom: 0px; padding-bottom: 0px; font-style: bold; -webkit-transition: 1s ease-out; -moz-transition: 1s ease-out; -o-transition: 1s ease-out; -ms-transition: 1s ease-out; transition: 1s ease-out; } a.nav1:active { color: black; margin: auto; width: 130%; margin-bottom: 0px; padding-bottom: 0px; font-style: bold; -webkit-transition: 1s ease-out; -moz-transition: 1s ease-out; -o-transition: 1s ease-out; -ms-transition: 1s ease-out; transition: 1s ease-out; }
you can't add boldness elements using font-style
. have use font-weight
property instead.
change this:
font-style: bold;
to this:
font-weight: bold;