navbar button style question

[teamwepv]

Hi:
Non-urgent question. I’ve created a “special” button in my main menu navbar using the following quick css:
.navbar-nav .btn.btn-special {
line-height: 25px !important;
background: transparent;
border: 1px solid #fff !important;
}
This creates a button that changes thickness of the border upon hover (a highlight type effect). I would like a solid 1px border that does not change thickness/highlight upon hover and is, in essence, a clean little oval around the text. Is that possible?

Thank you in advance.

[sharmstr]

hard to help without seeing it, but I’m guessing you need to define what happens on hover

COPY CODE

.navbar-nav .btn.btn-special:hover {
border: 1px solid #fff !important;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[teamwepv]

the link is http://www.teamflighttraining.com

I’m not sure what the styling attribute is called, but it’s regarding the “highlight” border effect. I’m trying to create a static border oval around the text. The quick css I’ve used has created a border with a “highlight” type effect. Upon hovering, the button then has a thinner 1px border, which is what I want, I do not want the “highlight” border effect prior to hovering.

Sorry for such a nitpicky type question.

[sharmstr]

.kleo-main-header .nav > li > a {
box-shadow: inset 0px 2px 0px 0px transparent;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[teamwepv]

Sharmstr = worth every $.
Resolved. Thank you.

[sharmstr]

awesome

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Author]

Posts