28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je reviens aujourd'hui vers vous car j'ai un p'tit soucis pour aligner correctement mon moteur de recherche interne.
Quelqu'un pourrait-il me dire ce qui ne va pas.
Pour info, j'utilise un script de google légèrement modifié de façon à le personnaliser pour mon site. --> http://www.gagnezplus.fr/BlueNeutral/index2.html
<FORM method=GET action=http://www.google.com/custom>
<INPUT TYPE=text name=q size=20 maxlength=255 value="search"> 
<input type=hidden name=domains value="www.gagnezplus.fr">
<input type=hidden name=sitesearch value="www.gagnezplus.fr" > 
<input type="image" src="images/button.png" class="input_button" width="40" height="26" align="right" name="btn" >
</FORM>

Modifié par Anthony87 (24 Apr 2009 - 09:51)
Salut anthony, oui je px t'aider il faut juste ajouter qlq ligne de css c'est tout Smiley ravi

Ligne N° 180 dans ta feuille de style:

.input_button {
float:left;
height:26px;
margin-right:1px;}

- tu ajoute une classe au zone de texte par ex input.search et tu mets ceci :

float:left;
margin:0 0 0 5px;

Et pour le formulaire tu ajoutes aussi une class dans laquelle tu mets un padding-top:9px

j'espère que ca va marcher pr toi
Merci,

J'my remets dès demain. Après avoir réglé ces soucis de validation et fait ce p'tit réglage, j'espère que ça fonctionnera.

Mais p... c'est chaud !

Merci encore.
Bonjour,

C'est re-moi.

J'ai donc suivi vos conseils, et apparemment côté validation, ce serait ok.
Par contre, j'ai un toujours un p'tit soucis avec l'alignement.

J'ai donc modifier ma feuille.css mais lorsque je modifie ma page html, ça ne va pas du tout.

mnjaha, tu pourrais me dire où comment je dois mettre mes class ?
Sous cette forme là ou pas du tout ?
<INPUT TYPE=text name=q size=20 maxlength=255 value="search">
ou plutôt comme ça <div> class=

Merci
Re, voila je vais vous tracer le chemin exacte et tu le suis. Je commence mtn avec le formulaire ( je vais ajouter une classe "search" dans la 1ere input apres je modifie le css du bouton [OK] et en dernier étape on ajoute du css au Form):

1 ======
<input type="text" value="search" maxlength="255" size="19" name="q" [b]class="search" />

A cette classe on attribue les éléments suivants dans la feuille de style:

input.serach
{
float:left;
margin:0 0 0 5px;
}
2 ======
maintenant tu rectifie la ligne 180 dans ta feuille css et qui concerne le bouton OK en supprimant margin-top:6px;

3======
En dernier lieu tu ajoute une classe au Formulaire (Form) comme suit :

<form action="http://www.google.com/custom" method="get" style="padding: 9px 0pt 0pt 10px;">

Et voila Smiley cligne [/b]
Modifié par mnajah (25 Apr 2009 - 23:01)
Merci encore à tous les 2.

Bien que sous ie il y ait encore un p'tit soucis, ça roule sous firefox et ça me convient déjà comme c'est.

Pour ce qui est des problèmes de validation, y en a que je comprends pas ?!
La grande majorité d'ailleurs...

Si on ne regarde que les premières erreurs, ben, je ne vois pas ce qui ne va pas ? Si je change ce qui est demandé, dans la plupart des cas, soit ça ne fonctionne plus, soit ça me génère de nouvelles erreurs. Mais que faire ? Est-ce grave si je laisse ce qui reste ?
Anthony87 a écrit :
Si on ne regarde que les premières erreurs, ben, je ne vois pas ce qui ne va pas ? Si je change ce qui est demandé, dans la plupart des cas, soit ça ne fonctionne plus, soit ça me génère de nouvelles erreurs. Mais que faire ? Est-ce grave si je laisse ce qui reste ?
Il faut te référer aux règles d'écriture qui sont liées au doctype que tu as choisi (typiquement : toutes les balises et leurs attributs doivent être en minuscules).

Pour les premières erreurs il faut remplacer
<SCRIPT language=JavaScript<!--

var imgs = new Array( "
background_menu2.png", "background_menu.png" );

for( var i = 0 ; i < imgs.length ; i++ )
{
var tmp = imgs[ i ];
(imgs[ i ] = new Image()).src = tmp;
} //-- -->
</script>
par
<script type="text/javascript"><!--

var imgs = new Array( "
background_menu2.png", "background_menu.png" );

for( var i = 0 ; i < imgs.length ; i++ )
{
var tmp = imgs[ i ];
(imgs[ i ] = new Image()).src = tmp;
}
//--></script>

Pour ce qui est de l'importance d'un code valide, cela permet d'avoir (ou d'espérer avoir) le même rendu quel que soit le navigateur utilisé...
Modifié par Heyoan (26 Apr 2009 - 12:45)
Je te remercie pour ce complément d'infos.

Je comprenais pourquoi il m'indiquait des erreurs qui ne semblaient pas en être.

Comme je le disais, je débute vraiment (mon site a 2-3 mais avant je ne me préoccupais pas de tout ça) est quand on commence à s'intéresser, on se rend compte que créer ou gérer un site, c'est pas si simple que ça en a l'air.

Je continue alors...

Merci encore.
Au secours !!

J'en ai marre, je ne comprends pas comment corriger ces anomalies -->
genre : <li><a href="page2.html" ><div class="titre_blanc_header">Articles</div></a></li>

En gros, ça me dit qu'avant Articles, je ne peux pas mettre > mais si j'enlève ou je modifie quoique ce soit, ma page ne s'affiche plus correctement et celà, quelque soit le dtd que je choisis.

J'ai bien essayé de chercher sur des forum et autres sites d'aides mais j'me sors pas.
Ok, j'vais essayer de regarder tout ça mais je me rends compte que c'est vraiment galère de vouloir bien faire quand on y connait rien.

Je pense que malgré tout, je vais avancer sur l'avancement des mises à jours des pages de mon site tout en essayant d'en apprendre un maximum.

Puisque ça ne gênera en rien la navigation, ça me permettra de mettre le nouveau design en ligne et de pouvoir gratter ensuite. L'ancien design (très basique) me soule un peu et j'ai hâte d'avoir les impressions sur le nouveau.

Merci encore et sûrement à très bientôt.