28220 sujets

CSS et mise en forme, CSS3

[Résolulu] Décalage de titre de bloc

Hello,
J'ai des interlignes qui viennent de je ne sais où... (mauvais parametrage des margins ?)
http://www.roadtothefuture.net/bordel/123/index.html

Code HTML :

<div class="bloc">
  <div class="bloc_title1"></div>
  <h2>Anciens Articles</h2>
  <div class="bloc_content1">
	  ghghgghhg
  </div>
  <div class="bloc_content2"></div>
</div>


CSS :

div.bloc {
   width: 150px;
   margin-bottom: 10px;
   text-align: left;
}
div.bloc_title1 {
   background: url('titrebloc_1.gif') center bottom no-repeat;
   height: 5px;
}
div.bloc h2, div.bloc h2 a.AIDEAns {
   background: url('titrebloc_2.gif') center no-repeat;
   color: #404040;
   font-weight: bold;
   text-align: center;
   font-size: 12px;
   padding: 0;
   margin: 0;
   line-height: 30px;
}
div.bloc_title a {
   color: #404040;
   font-weight: bold;
   font-size: 10pt;
}
div.bloc_content1 {
   background: url('contentbloc_1.gif') center repeat-y;
   padding: 0 6px 6px 12px;
   margin: 0;
}
div.bloc_content1 div {
   margin: 3px 8px 6px 6px;
   padding: 0 6px 3px 6px;
   background-color: #C0D3E2;
   width: 100px
}
div.bloc_content1 ul {
   margin: 0; padding: 0;
}
div.bloc_content1 ul li {
	background: transparent url('bullet.gif') no-repeat 0 0.6em;
    padding-left: 12px;
	list-style-type: none
}
div.bloc_content2 {
   padding: 0 6px 0 6px;
   height: 20px;
}
#colone_gche div.bloc_content2 {
   background: url('contentbloc_2.gif') center repeat-y;
}
#colone_drte div.bloc_content2 {
   background: url('contentbloc_3.gif') center repeat-y;
}


et j'ai un margin : 0 et un padding 0 dans mon body... Smiley bawling

Merci d'avance de votre aide...
Modifié par iPomme (15 Aug 2005 - 19:45)
Je vote coupable aussi et je rajouterais que IE doit pas aimer le height 5px ici :


div.bloc_title1 {
background: url('titrebloc_1.gif') center bottom no-repeat;
height: 5px;
}


Il faudrait diminuer la taille de la police
<quart d'heure méthodologico-philosophique>
Finalement, le vrai responsable derrière ces coupables occasionnels, celui qu'on n'ose pas inculper, c'est cette angoise de la hauteur non maîtrisée. Laisser faire le flux est encore le meilleur moyen de gérer les hauteurs CSS... Smiley cligne
</>
Modifié par Laurent Denis (15 Aug 2005 - 18:08)
Vous avez raison votre honneur mais n'est-ce pas un héritage des mises en pages tablolesque où tout devait être sous contrôle ?

Sans vouloir troller biensur Smiley lol
Modifié par tyx (15 Aug 2005 - 18:10)
Trollons allègrement, cher maître, bien que nous ne soyons pas vendredi : c'est en effet un héritage de cette triste époque. Mais, AMHA, c'est aussi un réflexe plus profond de "contrôle" de son rendu, qu'on n'ose pas lâcher aux incertitudes des médias multiples. Alors qu'on devrait se préoccuper d'abord de contrôler le HTML qui est derrière, pour pouvoir abandonner le tout en toute confiance aux différents navigateurs et autres agents utilisateurs...

Mais cela n'a plus aucun rapport précis avec le problème d' iPomme. Nous trollerons donc de concert une fois qu' iPomme aura confirmé que son problème était bien là, pour ne pas trop polluer ce sujet Smiley cligne
Modifié par Laurent Denis (15 Aug 2005 - 18:17)
Effectivement ça venait du line-height. Et j'avais oublié aussi ça margin: 0;

[Troll Mode=On]
Pour ce qui est de l'héritage des tableaux... personnelement je pense que ne créer que des designs extensibles limite énormément...

Et si on ne faisait que des designs fait pour etre visibles en police 8000. Autant arréter de faire du graphisme parce qu'il est imposible de faire un design propre qui s'agrandit comme par magie. On ne parlerait plus de Webdesign mais de Nuance de couleur... Une suite de carré coloré.

Si vous regardez Alsa au dela de 2 agrandissement le menu commence à se superposé... puis le reste.

Personnelement je considère que l'interet des CSS en matière de lisibilité se joue au niveau du style switching et de la désactivation de la CSS...
<Let's enjoy the troll > Smiley cligne

Tes deux remarques sur l'agrandissement et sur le style switching/désactivation des CSS sont tout à fait justes, et tu fais bien de rappeler cela.

Mais le propos des remarques précédentes était beaucoup plus ciblé : il ne s'agissait pas du fluide en général (effectivement plus problématique qu'on ne le dit souvent), mais bien de ce seul problème de la "hauteur", sur fond d'un constat : le media screen n'est pas un media paginé... mais de nombreux design le prenne comme tel.
Ah ok j'avais pas compris. Effectivement, ça pas été créé pour être utilisé comme tel. [End of the troll ?)
Sujet clos
Aller à