[html/css] Demande conseil pour balise DIV [Résolu/Fermé]

Signaler
-
Messages postés
553
Date d'inscription
mercredi 6 août 2008
Statut
Membre
Dernière intervention
6 août 2010
-
Bonjour,

Alors voilà:
Je suis donc un webmaster aspirant, c'est à dire: un maternelle à l'école du html/css. Je m'entraîne donc à créer plusieurs pages web et mini-sites en m'aidant des tutos sur le net ect.

Mon problème:
Je voudrais faire en sorte que mes éléments DIV adopte un espace automatique de supposons 50px ou 5% entre chacun d'eux (espace vertical), comme un blog fait sur skyblog par exemple: Le contenu peut s'agrandir ou diminuer dans l'élément, il resterait toujours 50px ou 5% entre div1 et div2, sans que div1 ne deborde sur div2.

Mes caprices:
-Pas de Jvs, ni de php; je souhaite rester en xhtml pur et dur.
-Je ne vous collerez pas mon code car le contenu est trop long pour en arriver à l'essentiel; je vous en trafic un subsitue de suite:

Mon code ressemble actuellement à ça:

<div id="p1">prout</div>
<div id="p2">pouet</div>


Celui de la feuille de style:
div { 
      La solution: pourrait-elle se placer ici ?;
}

#p1 {
      position: absolute;
      top: 50px;
}
<!-- En supposant que p1 fasse 100px de hauteur ... -->
#p2 {
      position: absolute;
      top: 200px;
}


Car actuellement, Je suis obligé de me taper des id785 et des #785 en précisant à chaque fois quelques px ou % de plus entre les id... Ce qui n'est vraiment pas simple, pratique, rapide, efficace et propre ...

Je vous remercie d'avance, ça m'aiderait beaucoup et me ferait gagner beaucoup de temps, merci à vous.

3 réponses

Messages postés
553
Date d'inscription
mercredi 6 août 2008
Statut
Membre
Dernière intervention
6 août 2010
42
Pas sur que ça t'aide.

Je suppose que les div concernées pourrait être les div contenant les news.

Au lieu d'avoir des id aux nombres à x chiffres, tu pourrais utiliser des divs comme celles la:

<div class="news">.....</div>


Et dans ton css, tu aurais

.news
{
     margin-top: 10px;
}


Comme ça, toutes tes divs avec la class news auront une marge supérieurs de 10 px, permettant de garder le même écart entre chaque.

CrowCrow ... MERCI !!

C'est exactement ce qu'il me fallait, ça marche comme je le voulais :)

Merci à ta rapidité et à ton efficacité ^^ ça va me faire gagner beaucoup de temps.

Merci, merci, merci ... merci. =D
Messages postés
553
Date d'inscription
mercredi 6 août 2008
Statut
Membre
Dernière intervention
6 août 2010
42
De rien, toujours content de rendre service :D