[Problème] Petit problème de CSS

[gilstandre]

Bonjour,

Je suis en train d'utiliser le module recherche, j'aimerais positionner mon champ de recherche à un endroit bien précis de l'écran et pour ce faire j'utilise le CSS.

Voici mon code généré à partir du fichier default.php du module de recherche:

<div class="search">
		<span class="searchlibelle"><label for="mod-search-searchword">Trouver un produit : </label></span><input name="searchword" id="mod-search-searchword" maxlength="20"  class="inputbox" type="text" size="70" value="Nombre d'année"  onblur="if (this.value=='') this.value='Nombre d'année';" onfocus="if (this.value=='Nombre d'année') this.value='';" /><input type="image" value="Valider" class="button" src="/Joomla_1.7.3-Stable-Full_Package_FRv2/" onclick="this.form.searchword.focus();"/>	<input type="hidden" name="task" value="search" />
	<input type="hidden" name="option" value="com_search" />
	<input type="hidden" name="Itemid" value="435" />

</div>

Et voici mon code css :

/*
SEARCH
*/  
div.search { position:absolute; overflow:hidden; margin:0 0 0 0; padding:0; text-align:left;   background:transparent; height:25px; top:125px; right:10px; }
input.inputbox { border:1px solid #8d9297; height:23px; background:white; color:#7a8384; text-align:right; margin:0; padding:0 7px 0 0;font-family:Arial, Helvetica, sans-serif; font-size:13px; text-transform:uppercase; width:200px; }
input.input_submit{ border:0; text-indent:-5000px; width:17px; height:19px; margin:0; padding:0; cursor:pointer; }

Mon champ est par conséquent en haut à droite, mais sans avoir la possibilité de rentrer quoique ce soit dans le champ.

En revanche, si j'enlève "position:absolute" du CSS, et que je le remplace par "position:relative" ça marche.

Je ne suis pas sûr de comprendre le problème.

Quelqu'un peut-il m'aider, svp ?

[thesoub]

Re : Petit problème de CSS

Salut !
Ton site est il en ligne ? Pour que nous puissions voir ça d'un peu plus près.
Si non tu peux jouer avec la propriété CSS "margin" pour décaler le bloc de ton choix. Tu utilises Firebug sur Fixefox ?
Attention toute fois à ce que le résultat soit toujours bon sur les différents navigateurs web...
A+

[gilstandre]

Re : Petit problème de CSS

Mon site n'est pas encore en ligne. En revanche, j'ai trouvé mon erreur mais pas comprise :
j'ai rajouté z-index dans mon css :
div#search { position:absolute; overflow:hidden; margin:0 0 0 0; padding:0; text-align:left; background:transparent; height:25px; top:125px; right:10px; z-index:50;}

Pourquoi sans z-index je ne peux rien saisir et pourquoi avec je peux saisir dans mon champ de recherche ?

[jovdev]

Re : Petit problème de CSS

Bonsoir,

Pourquoi sans z-index je ne peux rien saisir et pourquoi avec je peux saisir dans mon champ de recherche ?

Il est probablement sous autre chose avec un indexe supérieur

Faut penser à installer firebug four firefox ou un équivalent pour les autres navigateurs

Cordialement,
Joël