28173 sujets

CSS et mise en forme, CSS3

Bonjour,

j'ai un alignement bloc (une pub javascript) et un autre bloc qui ne s'aligne pas horizontalement.

j'ai bien utiliser les float:left avec aussi la margin-left.

Mais l'un en en-dessous de l'autre, en respectant les marges. Bizarre, j'y penche depuis pas mal de temps, rien à faire.

.ct2 {
  padding-top: 310px;
  padding-left: 20px;
}

.bc6 {
width: 425px;
height: 214px;
padding-top: 12px;
padding-left: 25px;
background: #fff url(images/fd2.png);
float: left; margin-left: 270px;
}

.bc7 {
height: 250px;
width: 250px;
float: left;

.im1 { 
height: 200px;
width: 200px;
}


<div class="ct2"><div class="bc7"><script javascript></script></div><div class="bc6"><img class="im1" />&nbsp;<img class="im1"/></div></div>

Modifié par kouiny (18 Nov 2006 - 01:03)
Regarder en bas à gauche la pub et à droite la météo, je n'arriev pas à les alignés !!

Une soluce svp ?
Modifié par kouiny (18 Nov 2006 - 01:01)
Un petit peu d'indentation ça ne ferai de mal a personne Smiley langue

Puis une petite révision des bases d'une mise en page sans table aussi (parce que la le tableau est un peu imbuvable...)

Parce que la j'ai beaucoup de mal a identifier les éléments...
Essaye de réduire les largeurs un peu ou les padding. De plus, je crois que tu devrais supprimer le margin-left.
Comment ça imbuvable, je ne comprend pas, dis moi ce que tu comprend pas où précise ce qui est mal construit, je ne vois pas de tableau ? Smiley eek
Neovov a écrit :
Parce que la j'ai beaucoup de mal a identifier les éléments...


C'est ce que je me suis dit aussi... Smiley smile Si on revient sur le site au bout de qqs mois, on ne sait plus à quoi correspondent les styles .xyz...
Du mal à identifier les éléments, un exemple ? Je débute c'est pour ça.

J'ai enlevez margin-left, ça aligne, mais du coup j'ai plus de marge entre les deux blocs. Smiley confused

Et sous IE7 et Firefox les blocs alignés sont placés différement en hauteur.
Modifié par kouiny (16 Nov 2006 - 16:48)
Augmente un peu la margin-left pour le second.

Et joue avec les margin-top pour les aligner verticalement.

On donne généralement aux styles des noms permettant d'identifier les éléments auxquels ils s'appliquent. Comme .pub ou .meteo. Si qqn d'autre ou toi-même revient sur le site après un bout de temps, vous saurez à quoi correspond le style. Et avec des /* commentaires */ c'est encore mieux.
.meteo {
width: 425px;
height: 214px;
padding-top: 12px;
padding-left: 25px;
background: #fff url(images/fd2.png);
}


J'aurais pas oublier un div supplémentaire pour les paddings ?
Modifié par kouiny (16 Nov 2006 - 18:08)
kouiny a écrit :
Je viens d'identifier les différents styles.

La différence entre margin-top et padding-top ?


up'