28173 sujets

CSS et mise en forme, CSS3

[Résolu] Sidebar IE6 décalé

Bonjour,

- Adresse du site :www.averse.fr.nf
- Wordpress avec le theme Mandigo

Problème(s) rencontré(s) :Sidebar IE6 décalé.


Comme vous pouvez le voir, la sidebare sous IE6 ne reste pas a droite et change selon la taille de l'article.
Sous firefox pas de probleme.
J'ai lus les poste a ce sujets mais cela ne marche pas.

Merci d'avance de votre aide,

Cordialement,
Modifié par trans13 (28 Jun 2007 - 14:12)
Bonjour,

Ligne 161 dans ta feuille de styles :
#main > table, .narrowcolumn {
width:100%;
}

La classe "narrowcolumn" ne peut pas s'appliquer vu qu'il y a deux td ayant chacun un contenu (aucun des deux ne saurait prendre 100% de la largeur), et le width: 100% sur le tableau ne s'applique pas dans IE6 car celui-ci ne comprend pas le sélecteur d'enfant >.

Donner une classe ou un identifiant au tableau, et faire directement :
table#machin {
	width: 100%;
}
Merci, je suis debutant que veux tu dire par :

"Donner une classe ou un identifiant au tableau, et faire directement :

table#machin {

width: 100%;

}"
pour donner une classe ou un identifiant , tu dois faire cela dans ton code html :

Cas de la classe :

<table class="machin">

</table>


et dans le fichier CSS tu auras :

.machin {
width: 100%;
}


si c'est avec un identifiant tu feras comme cela :


<table id="machin">

</table>


et dans le fichier CSS tu auras :

table#machin {
width: 100%;
}
et ça ne change rien qu'il soit en php..tu utilises les balises html pour faire ta page ..donc ca marchera. Le php s'utilise pour ce qui est dynamique or ton problème est de l'ordre statique donc html ..
essaye de faire les modifications que je t'ai indiqué et cela devrait fonctionner avec les class ou id (il faut choisir l'une ou l'autre des 2 méthodes )
Ok je fait

<table class="machin">

</table> dans index.php et

.machin {

width: 100%;

} dans mon style.css.php c'est sa?
si la feuille de style CSS que tu as déclarée avec la balise <link> est bien style.css.php oui cela marchera

A moins que tu n'aies du code php dans ta feuille de style, renommer ton style.css.php en style.css et faire la déclaration appropriée dans la balise link marchera aussi !
je vais essayer de mieux t'expliquer alors Smiley smile

voila le contenu de ta page index.php :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="fr">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>

<table class="machin">
<!-- ici tu mets tes colonnes..lignes etc .. -->
</table>

...
..
</body>
</html>


Donc à ce moment la, la feuille de style CSS correspondante déclarée dans la balise link est style.css

dans ce fichier tu vas retrouver le code suivant :


.machin {
width: 100%;
}


Voilà, j'espère que tu comprends mieux la façon dont il faut procéder
Ok mais <!-- ici tu mets tes colonnes..lignes etc .. --> ce n'est pas moi qui est fait le theme, que doit je mettre?

Merci de ton aide
Et si l'information a toujours du mal à passer, il va falloir revoir le B.-A.-ba de :
- HTML ;
- CSS ;
- PHP.

Smiley cligne
Modifié par Florent V. (27 Jun 2007 - 17:25)
Je doit vraiment être nul j'ai fait ce que vous m'avez dit et sa na pas marcher.
Si ya quelqun de gentil je lui passe les acces du ftp et il me le fait si il veut.

Merci beaucoup de votre aide,
trans13 a écrit :
Je doit vraiment être nul j'ai fait ce que vous m'avez dit et sa na pas marcher.

Ah ? Je ne vois pas de différence sur la version en ligne.

Donc pour récapituler tu as ceci :
<div id="main">
<table>
...
</table>
</div>

Le but est de donner une largeur de 100% au tableau. Sinon, il se limitera à la largeur nécessaire pour afficher son contenu, et voilà.

Théoriquement, tu devrais pouvoir faire ceci :
div#main > table {width: 100%;}

Ce qui veut dire : tout tableau qui est un enfant de la div qui a "main" pour identifiant (attribut id) aura une largeur de 100%.
Le « qui est un enfant de... », c'est le symbole « > » dans ton sélecteur CSS (le sélecteur CSS, c'est la partie avant l'accolade ouvrante).

Bon, donc ça c'est possible en théorie, d'ailleurs c'est ce qui est fait sur ton site, et ça marche avec la plupart des navigateurs... mais pas avec Internet Explorer 6.

Le plus simple est donc d'utiliser quelque chose qu'IE6 comprendra.

On modifie donc le code HTML ainsi :
<div id="main">
<table id="main-table">
...
</table>
</div>

Et dans le code CSS on fait ceci :
table#main-table {width: 100%;}

Et voilà, le tour est joué.


trans13 a écrit :
Si ya quelqun de gentil je lui passe les acces du ftp et il me le fait si il veut.

Non, ça n'est pas le genre de la maison.
Voir la règle du forum n°16.
Heu... je vais finir par te croire quand tu disais que tu es nul, là... Smiley sweatdrop
trans13 a écrit :
Voila je vient de le faire, regarde ce que sa fait je devient fou.

1. Tu n'as pas fait les modifications que je t'indique, ni dans le code HTML, ni dans le code CSS.
2. Par contre, ce que tu as réussi à faire c'est laisser trainer un bout de code au tout début de ta page :
[#red]</div>[/#]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Du coup, tous les navigateurs ignorent ton Doctype, et paf, rendu en mode Quirks. D'où tes problèmes de rendu pour la taille du texte dans les tableaux.


Bon. Quelques questions pour te situer un peu (parce que là on patauge un peu dans la semoule) :
1 - Tu n'es absolument pas familier des standards du web, du HTML, des CSS, etc ?
2 - Est-ce que tu comptes t'y intéresser ou bien tu veux juste mettre en place ce blog et rien de plus ?
3 - De toute évidence, tu as repris un thème existant pour Wordpress, puis tu y as rajouté un tableau HTML, sans savoir exactement ce que tu faisais. Est-ce bien intelligent d'intervenir ainsi dans un code que tu n'as pas l'air de comprendre ? Et le thème de Wordpress choisi ne suffisait-il pas ? Pourquoi le modifier ?
Oui je vais m'y interresser je n'ai jamais modifier quoi que ce soit moi. Le code c'est bon la?

Sinon pour apprendre tu a des sites?

Merci encore
Modifié par trans13 (27 Jun 2007 - 22:13)
trans13 a écrit :
Oui je vais m'y interresser je n'ai jamais modifier quoi que ce soit moi.

Il y a un début à tout. Smiley cligne

trans13 a écrit :
Le code c'est bon la?

On se rapproche mais il en manque encore un bout.

Tu as rajouté la ligne suivante dans ton code CSS :
table#main-table {width: 100%;}

Comme dit précédemment, la partie de gauche est le sélecteur, qui indique à quel(s) élément(s) du code HTML doivent s'appliquer les codes entre accolades (ici la largeur de 100%).
Le sélecteur vise un élément table qui aurait pour identifiant "main-table". C'est très bien, mais tu n'as rien de la sorte dans ton code HTML.

Il faut donc remplacer ceci :
<div id="main">
<table>

par ceci :
<div id="main">
<table id="main-table">

Et on devrait y être.

Par contre, si tu as d'autres changements à faire, je crois que je vais te laisser un peu te dépatouiller avec, parce que là c'est laborieux. Si tu n'as aucune notion de HTML et CSS, l'aide que moi ou d'autres pourraient t'apporter ici ne te sera pas d'une grande utilité.

trans13 a écrit :
Sinon pour apprendre tu a des sites?

Il y en a quelques uns d'indiqués par là :
http://css.alsacreations.com/Comment-debuter-et-trouver-l-information

Bonne continuation. Smiley smile
Voila c'est fait, mais sa n'a pas marcher completement je desespere. Smiley bawling
Modifié par trans13 (27 Jun 2007 - 23:32)
C'est bon j'ai réussi avec un align dans la sidebar et dans la liste de la sidebar.

Merci beaucoup de votre aide,

Cordialement,
Sujet clos
Aller à