Search bar height won't change
I'm working on a template using Wordpress and so far it has been basic HTML, CSS and some PHP but I'm currently running into one problem with the CSS for the header.
It currently looks like this. The search bar has moved up to the right location and the background fills the correct color but the height won't change. I want it to have some red padding above itself to match up the the diagonal box to the left. I've tried changing the height but that just causes it to extend down towards the bottom of the page and a border to the top or just all around does nothing. What am I doing wrong with the css for this search box?
He开发者_StackOverflow社区re is the css code for the search box.
/* Top search */
#nav-search {
background-color:#990000;
width: 250px;
display: block;
height: 30px;
line-height: 16px;
position: absolute;
right: 0px;
top: -22px;
}
#nav-search label {
display: none;
}
#s,
#searchsubmit {
border-radius: 3px 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
}
#s {
border: 1px solid #000099;
font-size: 11px;
height: 15px;
padding: 4px 5px 2px;
width: 130px;
}
#nav-search #s {
border-color: #000099; border-bottom-color: #0000BE; border-right-color: #000099;
}
#searchsubmit {
background: #669900 url(img/button-style-input.png) center left repeat-x;
border: 1px solid #666;
color: #fff;
font-size: 11px;
height: 23px;
letter-spacing: 1px;
line-height: 20px;
padding: 0 5px;
-moz-box-shadow: 0px 0px 1px #fff;
-webkit-box-shadow: 0px 0px 1px #fff;
}
/* Fixes Firefox 2 and 3 */
#searchsubmit, x:-moz-any-link {
padding: 0 5px 3px; *padding: 0 5px;
}
If this is the same sample for http://new-wav.com/, edit #nav-search to the following:
- adjust top position
- add padding-top
Hope this makes sense
精彩评论