I want to create a similar header with navigation and with search bar like
I have created this
I am ok everything but the problem is , My search bar and search button break , I mean they are not in the same line . I want logo , nav menu and search bar with button in a single line .
How can I do this ?
I think you just needed to remove the static width on `#search-form` so that it just knows to use the remaining space on the line.
Here is the fixed version:
@tomrogers123 : thank u very much , now I understand my problem
@Paulie_D: you rockz :)
One more question : @Paulie_D
why did u use a class in header ?
actually what does these codes do ?
That’s called a clearfix. It makes sure any containers with only floated elements inside of them (the header in this case) do not loose there height.
More here: http://www.webtoolkit.info/css-clearfix.html
It’s a clearfix ‘hack’.
If you do not set a height for the header (which I normally wouldn’t) then it will collapse as all of the elements inside are floated.
This stops that.
@tomrogers123 and @Paulie_D
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".