Problème de tableau CSS

Problème de tableau CSS - HTML/CSS - Programmation

Marsh Posté le 12-12-2004 à 14:29:41    

Salut  :jap:  
 
J'ai fait un tableau de 2 collones en CSS ( donc juste avec <div> ) et tout va bien.
 
Mais, le menu du gauche passe par dessus un <div> qui se trouve tout en dernier, après le tableau  :x  
 
Vous pouvez voir ça ici : http://rpgcreation.free.fr/cont.html
 
Voila le code HTML :

Code :
  1. <div class="gauche">
  2. Menu
  3. </div>
  4. <div class="centre">
  5. Contenu
  6. </div>
  8. <div class="menu4">
  9. Copyright
  10. </div>


 
Voila le code CSS :

Code :
  1. .gauche {
  2. position: absolute;
  3. left: 0;
  4. width: 180px;
  5. border: 0px;
  6. color : #000000;
  7. background-color: #FFFFFF;
  8. text-align : justify;
  9. font-size: 12px;
  10. font-family : Arial, Verdana, Helvetica, sans-serif;
  11. }
  13. .centre {
  14. margin-left: 180px;
  15. margin-right: 0px;
  16. border-top: 0px;
  17. border-left: 1px solid black;
  18. border-right: 0px;
  19. border-bottom: 0px;
  20. padding: 5px;
  21. background-color: #FFFFFF;
  22. color : #000000;
  23. text-align : justify;
  24. font-size: 13px;
  25. font-family : Arial, Verdana, Helvetica, sans-serif;
  26. }
  28. .menu4 {
  29. border-top: 1px solid #000000;
  30. border-left: 0px;
  31. border-right: 0px;
  32. border-bottom: 0px;
  33. width: 100%;
  34. background-color: #A4A3BD;
  35. font-size : 12px;
  36. font-family : Arial, Verdana, Helvetica, sans-serif;
  37. text-align : center;
  38. }


 
Voila...

Reply

Marsh Posté le 12-12-2004 à 14:29:41   

Reply

Marsh Posté le 12-12-2004 à 14:39:46    

<div class="titrelien">
<b>Création de RPG</b>
</div>
<div class="lien">
<a href="http://rpgcreation.free.fr/tuto/creer/creer.php" class="D2">&nbsp;<b>Créer un RPG 3D</b></a>
</div>
<div class="lien">
<a href="http://rpgcreation.free.fr/articles" class="D2">&nbsp;<b>Articles (13)</b></a>
</div>
<div class="titrelien">
<b>RPG-maker</b>
</div>
<div class="lien">
<a href="http://rpgcreation.free.fr/rm2k/tuto" class="D2">&nbsp;Tuto/Aide (4)</a>
</div>
<div class="lien">
<a href="http://rpgcreation.free.fr/rm2k/resources" class="D2">&nbsp;Ressources</a>
</div>
<div class="titrelien">
<b>Téléchargements</b>
</div>
<div class="lien">
<a href="http://rpgcreation.free.fr/telechargements_jeux.php" class="D2">&nbsp;Jeux (5)</a>
</div>
<div class="lien">
<a href="http://rpgcreation.free.fr/telechargements_programmes.php" class="D2">&nbsp;Programmes (25)</a>
</div>
<div class="titrelien">
<b>Newsletter</b>
</div>


 [:mlc]  
mais c'est quoi ce menu [:mlc]  
et pourquoi ya des balises <b>? [:jofusion]  
 

<td bgcolor="#A4A3BD">
<center>
<font color="blue" size="5">


 [:youpi]  
j'adore quand on mélange le vieux html et les CSS [:huit]  
 
Sinon, pour ton bug il faudrait te renseigner sur l'effet de ça:

position: absolute;


te renseigner sur l'optimisation de CSS
te renseigner sur la signification du mot "indentation"
 
et enfin mettre un joli doctype c'est cool, mais si tu pouvais respecter les demandes du doctype ca serait mieux [:linuxine]


Message édité par masklinn le 12-12-2004 à 14:40:27

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 12-12-2004 à 14:40:24    

beaucoup de div inutiles sur ce site :/
 
essayes de rajouter un clear:both sur ta classe menu4


---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. |  Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.
Reply

Marsh Posté le 12-12-2004 à 14:49:13    

Pour le doctype j'essai justement de tout respecter ( c'set pour ça que je met en CSS et que je met pas de tableau.
 
Pour le menu, je l'ai pas encore modifié en entier, cétait juste pour montré qu'il passe au dessus.
 
clear: both; marche pas.
 
Le div inutil c'est surement ceux du menu, t'inquiete pas je vais changé ça avec :
 

Code :
  1. <div id="lien">
  2. <a href"...">...</a><br/>
  3. <a href"...">...</a><br/>
  4. <a href"...">...</a><br/>
  5. <a href"...">...</a>
  6. <div style="border-top: 1px solid #000000;"></div>
  7. <a href"...">...</a><br/>
  8. <a href"...">...</a><br/>
  9. <a href"...">...</a>
  10. </div>


 
Sinon pour <b> je vois pas l'erreur ? je dois la aussi mettre un <div> ?? surement bon ba j'vais le faire alors.
 
Et enfin, je vais me renseigner sur l'optimisation de CSS et me renseigner sur la signification du mot "indentation" he he :)
 
Et si ça marche tjrs pas, je vous fait signe ;)
 
Voila

Reply

Marsh Posté le 12-12-2004 à 14:52:59    

pour ton menu, utilise plutôt une liste non ordonnée (ul li) ou une liste de définitions.
 
http://alsacreations.com/articles/economie
 
http://alsacreations.com/articles/


---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. |  Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.
Reply

Marsh Posté le 12-12-2004 à 14:55:17    

GuardianForce a écrit :


Code :
  1. <div id="lien">
  2. <a href"...">...</a><br/>
  3. <a href"...">...</a><br/>
  4. <a href"...">...</a><br/>
  5. <a href"...">...</a>
  6. <div style="border-top: 1px solid #000000;"></div>
  7. <a href"...">...</a><br/>
  8. <a href"...">...</a><br/>
  9. <a href"...">...</a>
  10. </div>



http://css.maxdesign.com.au/listamatic/

Citation :

Sinon pour <b> je vois pas l'erreur ? je dois la aussi mettre un <div> ?? surement bon ba j'vais le faire alors.


putain mais non [:mlc]  

div.gauche a {
    font-weight: bold;
}


http://www.w3.org/TR/CSS21/fonts.html#font-boldness
 
tu vas pas rajouter des divs à chaque fois que t'as un truc à modifier, c'est t00pid [:jagstang]  
et <b>, c'est du vieux HTML, ca n'a aucun sens sémantique (comme <i>, <u> ou <font> )


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 12-12-2004 à 15:30:12    

a ok, par contre... <em> c'est pas du vieux et ça fait déconner ma page...
 
Voila sinon je continu de chercher pour le problème...

Reply

Marsh Posté le 12-12-2004 à 16:00:59    

GuardianForce a écrit :

a ok, par contre... <em> c'est pas du vieux et ça fait déconner ma page...


Fais moi mal: les <em> tu les utilises où et pourquoi?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 12-12-2004 à 16:14:14    

Dans une de mes pages et pour remplacer <i>
 
Bon sinon je trouve tjrs pas la solution de mon problème ça me soule -__-
 
Help ^^

Reply

Marsh Posté le 12-12-2004 à 16:21:35    

Citation :

pour ton bug il faudrait te renseigner sur l'effet de ça:
position: absolute;


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 12-12-2004 à 16:21:35   

Reply

Marsh Posté le 12-12-2004 à 16:46:17    

erf... j'me suis renseigné mais j'ai rien trouvé...
 
J'ai trouver des site ou il utilise ça mais il explique pas tous les effets...
 
Mais mon poto Google m'a pas trouvé ça..
 
arg ! J'vais continué de chercher quand même.. faites moi signe si vous trouvez un site qui explique ;)
 
Voila

Reply

Marsh Posté le 12-12-2004 à 18:32:35    

ca fait sortir l'élément du flux du document, pour les autres éléments de ta page c'est comme si il n'était pas là, donc il n'a strictement aucune influence sur le positionnement du reste de la page. (idem pour fixed)


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 13-12-2004 à 01:04:53    

Pour la colonne de droite qui passe sous celle de gauche, il faut donne à la colonne de droite une marge à gauche au moins aussi grande que la largeur de la colonne de gauche.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 13-12-2004 à 12:03:32    

J'ai trouver mieux que tout ça =)
 
float: left et float: right
 
Voila mon problème est réglé.
 
J'vous dis quand même merci parce que vous m'avez pas mal aidé et mis sur la voie ;)
 
Voila

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed