I would like to hear what's the best thing to do with pure CSS.
The Situation:
I'm having a textbox in which i can search for specific items. Yet now i'm also having an advanced search with almost the same textbox yet the width of the advancedSearchTextbox is less than the default one.
My Question
What is the best way to style the textbox?
My Solution
I've fixed this now like this:
.defaultTextBox {
padding: 0;
height: 30px;
position: relative;
left: 0;
outline: none;
border: 1px solid #cdcdcd;
border-color: rgba(0,0,0,.15);
background-color: white;
font-size: 16px;
}
.advancedSearchTextbox {
width: 526px;
margin-right: -4px;
}
and then in the HTML it'd look something like this for the advancedSearchTextbox:
<input type="text" class="defaultTextBox advancedSearchTextBox" />
Is this the best way to do it? Or are there any other options available? As for just 1 other textbox it's do-able but what if i need more textboxes on other pages?
Thanks in advance :)!