Welcome to WebmasterWorld Guest from 54.162.136.26

Forum Moderators: not2easy

Message Too Old, No Replies

form throwing elements out of whack

     
3:23 pm on Jul 11, 2007 (gmt 0)

New User

10+ Year Member

joined:June 27, 2006
posts:20
votes: 0


I am trying to add a search form to the right of an image inside a div, and no matter how I try to style the form, it keeps pushing the elements below it out of whack.

Basically, I have a container div

#container {

padding: 0px 0px 0px 0px;
margin-top: 7px;
position: absolute;
right: auto;
left: auto;
width: 1008px;
height: 564px;
background-color: #FFF;
border-style: solid;
border-color: #000000;
border-width: 1px;
}

That contains another div which contains the masthead image of my page.

#masthead {
background-color: #FFFFFF;
width: 1008px;
height: 37px;
float: left;
}

Underneath the masthead div is another div which contains a menu

#navcontainer {
background-color: #FFFFFF;
position: relative;
height: 20px;
}

Within the masthead div, and to the right of the masthead image, I'd like to have a search form.

Any ideas on how to style the form so that it fits and does not throw the menu below it off?

thanks

4:48 pm on July 11, 2007 (gmt 0)

Preferred Member

10+ Year Member

joined:Apr 22, 2003
posts:441
votes: 0


Are there any styles on form or input? Try adding form{display: inline;}. I've noticed that forms have their own default padding and margins that make subsequent elements not look as expected.
10:20 pm on July 11, 2007 (gmt 0)

New User

10+ Year Member

joined:June 27, 2006
posts:20
votes: 0


thank you for this suggestion! It seems to have done the trick!
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members