PDA

View Full Version : How do you make the serachbox wider?


Boofo
04-23-2011, 04:19 PM
How can I make the searchbox on the navbar wider so it will hold more text? I know it must have something to do with the CSS but I can't quite get it working right.

--------------- Added 1303590445 at 1303590445 ---------------

Hopefully, I figured this out properly. Here is what I added to the additional.css to make the box 30px wider.

.globalsearch input.textbox {
width: 150px;
}

.globalsearch .textboxcontainer span {
width: 177px;
_width:170px; /* ie6 hack */
}

.navbar_search {
width:210px;
{vb:stylevar right}: {vb:stylevar padding};
}


And here is the original css code before my changes:

.globalsearch input.textbox {
width: 120px;
}

.globalsearch .textboxcontainer span {
border-top: {vb:stylevar navbar_tab_bevel};
border-{vb:stylevar left}: {vb:stylevar navbar_tab_bevel};
display: inline-block;
height: {vb:math {vb:stylevar navbar_tab_size.height}-4}px;
padding-{vb:stylevar left}: 2px;
padding-{vb:stylevar right}: 2px;
padding-top: 3px;
margin-bottom: 1px;
width: 147px;
_width:140px; /* ie6 hack */
}

.navbar_search {
position:relative;
width:180px;
{vb:stylevar right}: -{vb:math {vb:stylevar padding}*2};
display:block;
}


I only changed the lines I needed to and added those to the additional.css template. I looked at it in Opera 11.10, IE7, IE8 and FF4, and all looked fine. I don't have Chrome installed (because it sucks!) so I have no idea how it looks in that.

Can anyone tell me if I missed any other css settings so I don't get a nasty surprise later on down the road?