Page 1 of 1

Search button styling [SOLVED]

Posted: Thu Apr 23, 2009 4:49 pm
by pamelina
Hello,

In html template I have:

{search}


This is my search template:

{$startform}

{if isset($hidden)}{$hidden}{/if}

{$endform}

This is my CSS:

.search {
float: left;
text-align: right;
padding: 1em 0 0.4em 0;
margin-top: 40px;
margin-left: 10px;
width:205px;
height:75px;
}

.search input {
color:#000000;
border:1px solid #008B8B;
}


When there is border:1px solid #008B8B; in my css I GET BORDER AROUND SUBMIT BUTTON...
Is there a way to keep border around "search input" but lose it around submit button image?

Re: Search button styling

Posted: Thu Apr 23, 2009 7:40 pm
by uniqu3
you will need to add a class to your submit button

Code: Select all

><input name="submit" class="someclass" value="{$submittext}" type="image" src="path-to-my-submit-image.gif"/>
and then do your css

Code: Select all

.someclass input  {border:none;}

Re: Search button styling

Posted: Fri Apr 24, 2009 7:21 am
by pamelina
@uniqu3

I have done what was suggested above but it fails to work, I still have border around submit button.

Any other suggestions?

Re: Search button styling

Posted: Fri Apr 24, 2009 8:25 am
by uniqu3
then add to your another class and remove the border:.... from .search

Re: Search button styling

Posted: Fri Apr 24, 2009 9:24 am
by pamelina
@uniqu3

Just a moment after I have made a second post I figure it out..

.search input.someclass {
border:none;
}


Now it works perfect !

Thanks for all the help uniqu3.