Hvordan få søkefelt i samme linje som meny?

[G2Petter]

Hei.

Vi holder på å lage en nettavis på studiet, og jeg sitter her og jobber med strukturen på sida. Hvordan kan jeg få søkefeltet til å ligge i samme høyde som menyen? Jeg har eksperimentert litt med klasser på de forskjellige elementene i menyen, men har fjernet dem siden det ikke fungerte.

 

Her er relevant html og css:

 

 

<div id="menu">

<ul>

<li><a href="index.php">Hjem</a></li>

<li><a href="?cat=1">Nyheter</a></li>

<li><a href="?cat=6">Kultur</a></li>

<li><a href="?cat=5">Sport</a></li>

</ul>

 

<!--create the searchfield-->

<form method="get" action="http://bogus.uib.no/~lse100/wordpress/">

<input type="text" value="" name="s" id="s" />

<input type="submit" value="Søk" />

</form>

<!--searchform.php end-->

</div>

 

 

 

 

 

 

#menu {

background: #52606d;

margin: 0px;

padding: 4px 0px 4px 0px;

text-align: center;

border-bottom: 5px solid #888888;

}

#menu img{

border: none;

}

#menu h2 {

color: #ffffff;

font-size: 15px;

font-family: Helvetica, Arial, Verdana, Sans-Serif;

font-weight: bold;

margin: 0px;

padding: 0px 0px 0px 0px;

}

#menu li{

display: inline;

list-style-type: none;

margin: 0px;

padding: 0px;

}

 

#menu ul {

margin: 0px;

padding: 4px;

}

 

#menu ul li a {

font-family: Helvetica, Arial, Verdana, Sans-Serif;

font-weight: bold;

font-size: 15px;

color: #ffffff;

padding: 8px 20px 8px 20px;

margin: 0px 0px 0px 0px;

text-decoration: underline;

}

 

#menu ul li a:hover {

color: #ffffff;

background: #223546;

padding: 8px 20px 8px 20px;

text-decoration: none;

}

 

 

Jeg har sjekket med firebug, og det er ikke noe arv som påvirker #menu og dets elementer.

 

Link: http://bogus.uib.no/~lse100/wordpress/

 

(Se bort fra den stygge/ikke-eksisterende designen. Vi har ei gruppe som jobber med det i helga, og forhåpentligvis blir ferdige i løpet av mandagen.)

Endret 28. april 2007 av G2Petter

[Anders Moen]

Du må nok putte søkeformen i menyens <ul> liste, men jeg vet ikke om det er så "lurt" eller ei.

 

Fordi det er nok noe sånn at den automatisk går ned på neste linje etter ul.

 

Prøv å bytte den her

	<ul>
 <li><a href="index.php">Hjem</a></li>
 <li><a href="?cat=1">Nyheter</a></li>
 <li><a href="?cat=6">Kultur</a></li>
 <li><a href="?cat=5">Sport</a></li>
</ul>
 <!--create the searchfield-->
<form method="get" action="http://bogus.uib.no/~lse100/wordpress/">
<input type="text" value="" name="s" id="s" />
<input type="submit" value="Søk" />
</form>

med

	<ul>
 <li><a href="index.php">Hjem</a></li>
 <li><a href="?cat=1">Nyheter</a></li>
 <li><a href="?cat=6">Kultur</a></li>
 <li><a href="?cat=5">Sport</a></li>
                       <li><!--create the searchfield-->
<form method="get" action="http://bogus.uib.no/~lse100/wordpress/">
<input type="text" value="" name="s" id="s" />
<input type="submit" value="Søk" />
</form></li>
</ul>

 

 

Btw så vet jeg ikke hvor "bra" dette er for verken koden eller sida

[G2Petter]

Jeg fikk hacket det til med å putte dem i hver sin div inne i #menu, og så floate dem til hver sin side. Nå skal jeg bare dunke hodet i veggen til jeg får dem omtrent der jeg vil ha dem.

 

Edit: hva er det som gjør at IE kødder til dette? Den setter margin på sidebaren, og artiklene blir større enn de skal.

Endret 28. april 2007 av G2Petter