Solved

Suggestions -  Search Box look

Posted on 2011-09-13
5
200 Views
Last Modified: 2012-05-12
Hi,

 Please take a look here -  http://tinyurl.com/cityads


Suggest me some html/css  stuff to make the search box on the right look

1)ATTRACTIVE

 2)NEAT  

3)PROPERLY ALIGNED

4) PLACEMENT

I am looking forward for help with implementing some css code - so please provide me some css code/examples that will do the trick.

Many Thanks.
0
Comment
Question by:ee-itpro
5 Comments
 
LVL 8

Accepted Solution

by:
MelMc earned 250 total points
ID: 36529787
This is pretty straight forward search box. I would consider putting some padding, maybe about 2px on the search input itself so that the text does not sit directly on the border.
You may want to consider moving the GO button next to the search box.
Also, make sure that your drop downs and search box height are all the same for consistency.
0
 
LVL 5

Assisted Solution

by:DerZauberer
DerZauberer earned 250 total points
ID: 36529872
The form could have style "text-align: right;", i think this makes alignment more easy.
Your label-divs could then have "text-align: left;" each.
0
 

Author Comment

by:ee-itpro
ID: 36529939
Please provide some demo code or some example resources for search box code.

I'm not a designer/css developer so i can't do this on my own.  
0
 
LVL 30

Expert Comment

by:LZ1
ID: 36530165
http://www.designvsart.com/blog/2007/11/01/search-box-design-examples/

http://www.noupe.com/showcases/showcase-of-inspiring-search-box-designs.html - 3rd one down may serve you best

http://www.smashingmagazine.com/2008/12/04/designing-the-holy-search-box-examples-and-best-practices/

All in all we can't design one for you, however the examples given here by all the experts are pretty good. Use a little bit of padding on the input give it a nice looking button and your good to go.
0
 

Author Comment

by:ee-itpro
ID: 36531744
Thanks,  i'll try out these tricks and let you people know how it goes
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Returning a value from a class function to a partial view in MVC5 7 46
Designing forms 3 41
Wordpress themes CSS? 6 30
[Bootstrap] Navigation Bar Collapse 27 33
When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

685 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question