28220 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

j'ai un problème de positionnement des div après le header.
Si vous pouviez comparer voir avec FireFox et IE, ce serait vraiment bien :
www.cccwindbeutel.info/test/

Alors le index.php :
a écrit :

Voir dernier post


Puis voici mon fichier CSS que j'ai modifié plus de fois pendant ces 2 dernières heures que pendant toutes les heures auparavant.
Il se peut que tout le css qui concerne ce qui est après le header soit peut-être mauvais car j'ai modifié le css body et le css general. Et je n'arrive pas à modifier les autres div pour IE...
a écrit :

Voir dernier post


Mon fichier accueil.html qui est le 1er include lorsqu'on arrive sur le site n'est pas en XHTML Strict 1.0 ni rien du tout, ce n'est qu'un banal fichier html que j'ai pris de l'ancienne version du site en enlevant le <head>.....</head> et les 2 balises <body>, </body>
Je ne vous le cite pas car le fond et la forme ne sont pas du tout séparés.

Merci d'avance pour votre aide et bonne nuit.

Cordialement,

Christopher Bender
Modifié par Mister_ben (18 Apr 2006 - 21:26)
Je suis sûr que la solution est toute simple mais la 1ère fois, c'est pas facile à trouver...

#EDIT : Peut-être les marges négatives ?
Modifié par Mister_ben (18 Apr 2006 - 14:00)
Bonjour Mister_ben,

Ta page comporte beaucoup d'erreurs de syntaxe html.

La correction des erreurs de syntaxe est un préalable avant toute recherche de problème css, qu'elles soient directement liées ou non à ton soucis d'affichage.

Le validateur t'indique la cause de chaque erreur, sachant que, souvent, une correction permet de corriger plusieurs erreurs d'un seul coup.
Smiley cligne
Modifié par Vero (18 Apr 2006 - 14:05)
Bon je vais déjà corriger les 4 premières pages en include.
Je reverrai juste après. @ dans pas très longtemps, normalement Smiley smile
Cela fait 1 h que je cherche une solution pour ma barre de recherche Google Adsense et je ne sais plus du tout quoi faire...

J'ai essayé le div pour la barre et le logo google, le div que pour le logo, le float pour ce div, etc...

Si quelqu'un pouvait me dire comment bien l'intégrer sur Firefox ET Internet Explorer.

Avant pour Firefox tout allait bien, mais pas pour IE.
De plus le code n'était pas valide XHTML 1.0 Strict

Maintenant que j'ai modifié le code Google Adsense Recherche, celui-ci est valide XHTML 1.0 Strict.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.cccwindbeutel.info%2Ftest%2F

Voici le code XHTML :
a écrit :

Voir dernier post


Et voici le code CSS :
a écrit :

Voir dernier post


Sur Firefox, aucun problème.
Sur IE, toujours un problème. Déjà on voit Google Adsense Recherche, contrairement à il y a quelques heures avec l'ancien code non valide XHTML 1.0 Strict. Mais le positionnement n'est pas bon ... Smiley ohwell

Merci beaucoup par avance !!

Christopher


#EDIT : Si vous avez une solution tout en gardant la barre de recherche en un seul bloc tel que le code ci-dessous original donné par Google Adsense, je prends tout de suite... :
a écrit :

Plus d'actualité !


Avec Firefox :
Impeccable (image retirée)

Avec IE :
Décalage entre image Google et champ de recherche (image retirée)
Modifié par Mister_ben (18 Apr 2006 - 20:33)
Smiley decu c'est à croire que personne n'a Google Adsense Recherche.
Donc tout le monde ne prendrait que le Google Adsense Contenu...
Si c'est ainsi, dès ce soir, si personne n'a une "petite" solution, j'abandonne définitivement Google Adsense Recherche... Smiley sweatdrop

Plus sérieusement, c'est pas très important comme problème. Je peux très bien l'enlever et continuer à coder la suite.

@+

P.S. Désolé d'être impatient, mais google adsense est pourtant connu... même si les recherches "css xhtml google adsense" sur google.fr ou le forum Alsa n'ont pas été fructueuses...
Au plaisir de vous lire... (même pour me dire une réponse négative, ca fait tjs plaisir Smiley ravi )
Modifié par Mister_ben (18 Apr 2006 - 19:19)
Pourquoi ne pas mettre le bloc de Google Adsence Recherche dans un div ? Enfin, je ne sais pas si c'est possible mais c'est déjà une piste Smiley ohwell !
je crois que je l'ai déjà fait, mais je vais réessayer Smiley cligne
En tout cas merci pour ta réponse Norore Smiley smile

#EDIT : j'avais déjà tenté de mettre tout Google Adsense Recherche dans un div mais à cause du XHTML 1.0 Strict et de l'image Google, je devais faire un class ou id spécifique à l'image. Donc actuellement j'ai un div pour l'image.
Je vais voir en mettant un div qui englobe le tout : le div de l'image + la barre de recherche.
Modifié par Mister_ben (18 Apr 2006 - 19:25)
Je suis en train de tout fouttre en l'air avec cette barre de recherche. Il y a tout qui part n'importe où à cause de ces différences Firefox/IE.
Quand ca marche pour l'un, ca déconne pour l'autre.
et vice versa...

#EDIT : j'ai remis comme c'était avant, c'est à dire avant la réponse de la gentille personne il y a quelques dizaines de min.

a écrit :

Voir dernier post


a écrit :

Voir dernier post



#EDIT 2 : Ne me dites pas que ma page est bourrée d'erreurs car elle n'en contient que 16. Actuellement je re-teste avec tous les div de la page "sommaire" et "contenu". Donc il y en a 66. Mais le problème de la barre Google Adsense est déjà là même sans le sommaire et le contenu...
Modifié par Mister_ben (18 Apr 2006 - 20:31)
Bon j'ai trouvé.
Je vous donne tout de même les codes CSS et XHTML 1.0. Cela peut toujours servir à d'autres...
J'ai essayé une tonne de possibilités... celle-ci me satisfait Smiley smile

Voici la capture d'écran (sous IE !!! Smiley lol )

édit par Igor: merci d'utiliser l'option vignette pour proposer des images, les utilisateurs de petites résolutions reconnaissants Smiley cligne

Code XHTML : (entier)
a écrit :

<div class="headercontenu">

<object type="application/x-shockwave-flash" width="550" height="70" data="../flash/ccc-final.swf">
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="movie" value="../flash/ccc-final.swf" />
</object>


<div class="googleimg">
<a href="http://www.google.com/">
<img src="http://www.cccwindbeutel.info/test/pages/google.png" alt="Google" />
</a>
</div>

<div class="googlerecherche">
<!-- Search Google -->
<form method="get" action="http://www.google.fr/custom">
<table>
<tr>
<td valign="top" align="left">
<input type="text" name="q" size="31" maxlength="255" value=""></input>
<input type="submit" name="sa" value="Rechercher"></input>
<input type="hidden" name="client" value="pub-2419441039886363"></input>
<input type="hidden" name="forid" value="1"></input>
<input type="hidden" name="channel" value="2006790734"></input>
<input type="hidden" name="ie" value="ISO-8859-1"></input>
<input type="hidden" name="oe" value="ISO-8859-1"></input>
<input type="hidden" name="cof" value="GALT:#E9382F;GL:1;DIV:#FF0000;VLC:7E3939;AH:center;
BGC:F2F2FF;LBGC:FF3333;ALC:E9382F;LC:E9382F;T:000000;
GFNT:7E3939;GIMP:7E3939;LH:117;LW:121;
L:http://www.cccwindbeutel.info/gif/ccclogo.gif;
S:http://www.cccwindbeutel.info/;LP:1;FORID:1;"></input>
<input type="hidden" name="hl" value="fr"></input>
</td>
</tr>
</table>
</form>
<!-- Search Google -->
</div>

</div>


Code CSS : (partie qui concerne le sujet)
a écrit :

#header {
width:615px;
height:145px;
left:145px;
top:0px;
position:absolute;
background-color:#8F0000;
}

.headercontenu {
width:550px;
height:102px;
left:32px;
top:21px;
position:relative;
}

.googleimg {
width: 75px;
height: 28px;
float: left;
}

.googlerecherche {
width: 390px;
height: 28px;
position: relative;
}

a img /* Toutes les images contenues dans un lien */
{
border: none; /* Pas de bordure */
}


Code XHTML de l'index (partie qui concerne le sujet)
a écrit :

<body>


<div id="general">

<div id="logo">
<?php include('pages/logo.html'); ?>
</div>


<div id="header">
<?php include('pages/cCc-FiNaL.html'); ?>
</div>
...
...
etc..


Voilà, alors merci à tous pour votre soutien moral.
Merci aussi aux personnes qui m'ont répondues, c'est très gentil de leur part.

Sur ce, @ dans pas très longtemps, lors d'un prochain Sujet Smiley cligne



P.S. Je supprime les sources des précédents messages.
Modifié par Igor (18 Apr 2006 - 20:34)