CSS editing padding in sticky nav drop down menu
Permalink January 12, 2016 at 10:18 AM
I'm editing the main.css file for a theme that has a sticky header navigation menu. It looks beautiful when I scroll down, but when I hover over the right-most drop down, there is not enough padding and the pages and box itself are off the page. This happens no matter the size of the screen.
It should be an easy CSS fix right? But I've tried putting in padding and margin edits and it's just not having any effect. Maybe I'm not putting it in the right places?
Please help,
#ff-header-wrap {
z- index: 2 ;
position: relative;
top: 0 ;
left: 0 ;
width: 100 %;
background- color: #ffffff;
- webkit- transition: height 0. 3s;
- moz- transition: height 0. 3s;
- ms- transition: height 0. 3s;
- o- transition: height 0. 3s;
transition: height 0. 3s;
header #logo {
display: inline- block;
height: 300px;
#ff-header-wrap {
z- index: 2 ;
position: relative;
top: 0 ;
left: 0 ;
width: 100 %;
background- color: #ffffff;
- webkit- transition: height 0. 3s;
- moz- transition: height 0. 3s;
- ms- transition: height 0. 3s;
- o- transition: height 0. 3s;
transition: height 0. 3s;
header #logo {
display: inline- block;
height: 300px;
line- height: 300px;
float: left;
font- family: "Roboto" , sans- serif;
font- size: 14px;
font- color: #000000;
font- weight: 400 ;
- webkit- transition: all 0. 3s;
- moz- transition: all 0. 3s;
- ms- transition: all 0. 3s;
- o- transition: all 0. 3s;
transition: all 0. 3s;
}
header {
display: inline- block;
float: right;
}
header {
line- height: 150px;
margin- left: 20px;
color: #ffffff;
font- color: #1e4191;
font- weight: 300 ;
font- size: 14px;
text- transform: uppercase;
- webkit- transition: all 0. 3s;
- moz- transition: all 0. 3s;
- ms- transition: all 0. 3s;
- o- transition: all 0. 3s;
transition: all 0. 3s;
}
header : hover {
font- weight: strong;
}
header . smaller {
height: 75px;
}
header . smaller h1#logo {
height: 65px;
line- height: 75px;
font- size: 30px;
}
header . smaller nav a {
line- height: 75px;
}
@ media all and ( max- width: 660px) {
}
header {
display: block;
float: none;
height: 50px;
text- align: center;
margin: 0 auto;
}
header {
line- height: 50px;
margin: 0 10px;
}
header . smaller {
height: 75px;
}
header . smaller h1#logo {
height: 40px;
line- height: 40px;
font- size: 30px;
}
header . smaller nav {
height: 35px;
}
header . smaller nav a {
line- height: 35px;
}
}
What is the address of your website?