-
Mar 20th, 2014, 10:36 AM
#1
Thread Starter
Lively Member
My navigation buttons do a little jump when being hovered over.
My navigation buttons on my site do a little flicker to the right and also a little flicker below when being hovered over. How do I stop this.
This is the CSS i have used to create my navigation bar.
#nav {
background-image:url(../Images/red-gradient.jpg);
border-top:2px black solid;
border-bottom:2px black solid;
border-left:2px black solid;
border-right:2px black solid;
padding-left:6%;
margin-right:1px;
margin-top:-2px;
width:838px;
}
#nav ul {
list-style: none;
margin: 0 ;
padding: 0 ;
line-height: 1;
display: block;
zoom:1;
}
#nav ul:after {
content: ' ';
display: block;
font-size: 0;
height: 0;
clear: both;
visibility: hidden
}
#nav ul li {
float: left;
display: block;
padding: 0px;
margin: 0 6% 0 0;
}
#nav ul li a {
color: white;
text-decoration:none;
display: block;
padding: 15px 26px;
font-family: 'open sans', sans-serif;
font-weight: 400;
text-transform: uppercase;
font-size: 15px;
position: relative;
}
#nav ul li a:hover {
background-color:#FF2D2D;
padding-bottom:16px;
border-bottom:2px;
text-shadow:1;
border-bottom-color:white;
border-bottom-style:solid;
font-family:comic sans ms, Geneva, sans-serif;
font-size:15px;
color:White;
margin:-1px}
#nav ul li a:after {
content: '';
display: block;
position: absolute;
right: -9px;
top: 19px;
height: 6px;
width: 6px;
background:white;
opacity: .7;
}
Last edited by junied32167; Mar 24th, 2014 at 09:47 AM.
-
Mar 24th, 2014, 09:28 AM
#2
Re: My navigation buttons do a little jump when being hovered over.
It looks like, at a quick glance, you are going from a 2 pixel border to a 3 pixel border.
"Ok, my response to that is pending a Google search" - Bucky Katt.
"There are two types of people in the world: Those who can extrapolate from incomplete data sets." - Unk.
"Before you can 'think outside the box' you need to understand where the box is."
Tags for this Thread
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|