Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Search Bar Header HEIGHT size

Search Bar Header HEIGHT size

Views: 1,097

Results 1 to 4 of 4
24 Aug 2012, 3:21 PM
#1
locbones avatar

locbones

New Zenner

Join Date:
Aug 2012
Posts:
2
Plugin Contributions:
0

Search Bar Header HEIGHT size

I have spent more time than I care to admit trying to adjust the search bar HEIGHT in website. Looked up several posts and attempted the different methods to no avail. I have been editing tpl_search_header.php to try and accomplish this. Also tried messing with CSS functions, no dice. Width was easily adjustable, But It seems I am missing something for the height. I am using "Avignon" template, and there is no tpl_search_header.php for Avignon, it uses Template_Default.

The website in question is http://aroundthehomeonline.com/zc

$content .= zen_draw_input_field('keyword', '', 'size="6" maxlength="30" style="width: 150px"; height: 66px" value="' . HEADER_SEARCH_DEFAULT_TEXT . '" onfocus="if (this.value == \'' . HEADER_SEARCH_DEFAULT_TEXT . '\') this.value = \'\';" onblur="if (this.value == \'\') this.value = \'' . HEADER_SEARCH_DEFAULT_TEXT . '\';"') . ' ' . zen_image_submit (BUTTON_IMAGE_SEARCH,HEADER_SEARCH_BUTTON);

Highlighted in red are the only changes I have made to the search header PHP.
More detailed info can be given upon request, I wasn't sure all what was needed.
ANY help with this would be greatly appreciated! (I might even go spastic and try to center it also...)

24 Aug 2012, 4:09 PM
#2
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Location:
Lansing, Michigan USA
Posts:
19,793
Plugin Contributions:
2

Re: Search Bar Header HEIGHT size

You can do it indirectly in the stylesheet:

#navMainSearch input {padding: .5em 0 .5em 0; font-size: 1.3em;}

The font-size part is optional. Adjust the values as necessary, and add values to the left and right if your text doesn't fit.

This will affect the button, too, but it looks right to me.

24 Aug 2012, 11:30 PM
#3
locbones avatar

locbones

New Zenner

Join Date:
Aug 2012
Posts:
2
Plugin Contributions:
0

Re: Search Bar Header HEIGHT size

Awesome! Looks great, now if I could also bug you to help me center it then I can rest easy :D

25 Aug 2012, 1:10 AM
#4
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Search Bar Header HEIGHT size

#navMainSearch input {margin-top:12px;}
#navMainSearch input+input+input+input+input {margin-top:10px; height: 34px;}
```Adjust to taste.
The second rule affects only the search button.