Creer une bar horizontale ac liste et form

Fermé

clem25 - 15 déc. 2012 à 02:03
astuces72 Messages postés 7762 Date d'inscription vendredi 15 janvier 2010 Statut Membre Dernière intervention 15 novembre 2024 - 15 déc. 2012 à 09:17

Bonjour,

J aimerais cree une bar horizontale ac de ds une liste et bar de recherche. J aimerais que cette bar soit d'une couleur (ici bleu mais je m en fiche). Le probleme c est que quand j essaye d'espacer la liste ac la bar de recherche ac margin ou padding la couleur disparait. Je pense que je n utilise pas du tout le bonne methode. De plus j aimerais que le petit espace blanc au-dessus de ma bar disparaisse. En d autre terme que la couleur commence des le haut de la page.

Merci bcp pour votre aide (je sais je suis nul).

Le code:

#bar {
background-color: blue;
}

#menu ul li{
display: inline;
float:left;
}

#form {
padding-left: 30px;

}
</style>
</head>

<body>
<div id="bar">

<div id="menu">
<ul>
<li id="current"><a href="index.html">Home</a></li>
<li><a href="index.html">Archives</a></li>
<li><a href="index.html">Profile</a></li>
<li><a href="index.html">Followers</a></li>
<li><a href="index.html">Support</a></li>
</ul>
</div>

<div id="form">
<form method="get" action="http://www.google.com/custom">
<input name="q" size="25" maxlength="255" value="" type="text" />
<input name="sa" value="search" type="submit" />
<input name="cof" value="" type="hidden" />
</form>

A voir également:

Creer une bar horizontale ac liste et form
Créer une liste déroulante excel - Guide
Créer un compte gmail - Guide
Créer un compte google - Guide
Comment créer un groupe whatsapp - Guide
Créer une adresse hotmail - Guide

1 réponse

Réponse 1 / 1

astuces72 Messages postés 7762 Date d'inscription vendredi 15 janvier 2010 Statut Membre Dernière intervention 15 novembre 2024 1 639
Modifié par astuces72 le 15/12/2012 à 09:30

slt

essaye ça:

<style type="text/css">
#bar { 
background-color:#F36; 
} 
.text_deco{
color: #FFF;
text-decoration: none;	
}
li{
display: block;
float: left;
padding: 4px;
} 
#pos_form {
padding-left:  450px;
} 
</style>
</head>
<body> 
<div id="bar">
<li id="current" ><a href="index.html" class="text_deco">Home</a></li> 
<li><a href="index.html" class="text_deco">Archives</a></li> 
<li><a href="index.html" class="text_deco">Profile</a></li> 
<li><a href="index.html" class="text_deco">Followers</a></li> 
<li><a href="index.html" class="text_deco">Support</a></li> 
<div id="pos_form">
<form method="get" action="https://www.google.com/webhp"/> 
<input name="q" size="25" maxlength="255" value="" type="text" /> 
<input name="sa" value="search" type="submit" /> 
<input name="cof" value="" type="hidden" /> 
</form> 
</div>
</div> 
</body>

Discussions similaires

créer une adresse gmail pour une autre personne