How do I remove nav underline on hover from Bootstrap theme?


Tags: html,css,twitter-bootstrap

Problem :

I went into the css and removed all of the text-decoration:underline but for some reason it's still showing up. Can somebody please tell me how to remove the top navigation underline when you hover over the nav?

Here is a link to the Oleose theme.

http://www.scoopthemes.com/templates/Oleose/Freeze/



Solution :

Here is the culprit. It's a pseudo-element (:after) that makes the underline under the link.

header .navbar-default ul.navbar-nav li a:hover:after {
  background: #ffffff;
}

Just remove this or set background to transparent. Or even better remove this one too.

header .navbar-default ul.navbar-nav li a:after{
    ....
}

Here is the style made for the underline.


    CSS Howto..

    How do I split a WordPress theme into 2 columns?

    How to activate a CSS property according to a variation in PHP code or URL direction?

    How to create a table with fixed layout?

    version control: how to control css and js compressed/minified versions between environments

    How to make hovering over a class to trigger changes in other classes?

    How to change anchor color when you hover over a list

    How To Style background-image CSS

    How this switch button work by CSS?

    How can I apply a custom css rule to small helping arrows that appears on column reordering in Kendo UI grid

    How to add padding to a ul/li menu with a background image?

    How to have background-image and gradient background-color work on one selector in CSS?

    how to make the postion close X in css file in top instead of bottom

    Using Javascript or JQuery to show/hide on click, and change image as well

    Using CSS, how to create a two-column grid with equal-width columns that are “only as narrow as required”?

    How to re-animate CSS3 animations on class change

    How to reveal content behind a div with pure css?

    How to apply External CSS to Html Helper Class Elements?

    How to chain multiple -webkit-transition animations in my css without keyframes

    How do I get my divs to ease in right after eachother on page load?

    How to detect if content have more then one line in Angular?

    How to increase the distance between table columns in html?

    How to change css styling for different lines within a paragraph in javascript

    How to use different CSS opacity in a nested div? [duplicate]

    How to make vim alphabetically sort CSS rules within a single line?

    How to make a jQuery script and CSS responsive?

    How do I make my website’s layout work gracefully with different browser window sizes, like Tumblr does?

    How to stop background layering with CSS?

    How do I override the default layout

    How to disable border on the second last child of div in CSS?

    How to use images in css with Webpack