Alignement des blocs horizontal CSS

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Alignement des blocs horizontal CSS

jacques33-40

Vivre c'est déjà lutter !

Bonjour,

J'ai un souci à vous soumettre:
je suis en train de refaire mon site et j'ai choisi de le réaliser en utilisant au maximum les feuille de style.
Voici la page d'accueil : http://develop.sosvacances.com/.
Pour aller au plus vite, la page est conçu sur trois colonnes dans un conteneur

Code :

<div id="contenu">
<div id="cont_hd"></div> (Div affichant l'image de l'angle)
<div id="cont_hg"></div> (Div affichant l'image de l'angle)
affichage de la colonne de gauche(les box s'affichent les unes sous les autres)
---------------------------------------
<div id="blocpromovol_1">
colonne 1
</div>
Informations centrale (les box s'affichent les unes sous les autres)
---------------------------------------
<div id="blocpromovol_1">
colonne 2
</div>
<div id="blocpromovol_1">
colonne 2
</div>
<div id="blocpromovol_1">
colonne 2
</div>
affichage de la colonne de droite(les box s'affichent les unes sous les autres)
---------------------------------------
<div id="blocpromovol_2">
colonne 3
</div>
<div id="cont_bd"></div> (Div affichant l'image de l'angle)
<div id="cont_bg"></div> (Div affichant l'image de l'angle)
</div>

Mon souci vient de l'affichage de la colonne de droite: J'aimerai pouvoir dire à ma feuile de style que l'affichage doit être à droite et à 2 px du haut du conteneur.
Actuellement tel que j'ai fait cela ne va pas car en fonction des écran et des navigateur, cette colonne ne s'affiche pas au bon endroit. Elle est dépendante de la longueur de la colonne précédente.

Voici un extrait de ma feuille de style:

Code :

#contenu {
float: left;
width : 974px;
height : 100%;
background-color : #ffffff;
margin-top: 10px;
margin-right: 25px;
margin-bottom: 25px;
margin-left: 25px;
}
#cont_hg, #cont_hd, #cont_bd, #cont_bg
{
height: 5px;
width: 5px;
background-repeat: no-repeat;
}
#cont_hg{
background-image : url('../images/ang_sable_h_g.png');
background-position:top;
}
#cont_hd{
background-image : url('../images/ang_sable_h_d.png');
background-position:top;
float: right;
}
#cont_bd{
background-image : url('../images/ang_sable_b_d.png');
background-position:bottom;
float: right;
clear: both;
margin-bottom: -15px;
}
#cont_bg{
background-image : url('../images/ang_sable_b_g.png');
background-position:bottom;
clear: both;
}
#blocpromovol_1 {
float : left;
background : url('../images/fond_box_1194px.png') repeat-x top;
background-position:top;
width : 250px;
height : auto;
margin : 2px 0px 0px 8px;
}
#blocpromovol_2 {
float : right;
background : url('../images/fond_box_1194px.png') repeat-x top;
background-position:top;
width : 250px;
height : auto;
margin : -550px 6px 0px 0px!important!;
margin : -523px 6px 0px 0px;
position: relative;
}

Quelqu'un aurait une idée pour m'aider à avancer?

Merci

Publicité

jacques33-40

Vivre c'est déjà lutter !

Bon Ok je me suis trompé de rubrique, je vais le mettre dans la bonne
Bonne fin de journée

aspirateur

Salut,

Dans ton code HTML place la div "blocpromovol_2" après la div "blocformulairevol"

Ensuite dans le CSS modifie le comme ca:
#blocpromovol_2 {
float : left;
background : url('../images/fond_box_1194px.png') repeat-x top;
background-position:top;
width : 250px;
height : auto;

}

FORUM HardWare.fr

Graphisme

Web design

Alignement des blocs horizontal CSS

Sujets relatifs
Souci avec CSS dans un site WEB	Besoin d'aide PHP et CSS
Probleme résolution et CSS	Défilement horizontal auto de photos
Votre avis sur ma galerie CSS	Factoriser une couleur dans feuille CSS
Problème CSS résolution d'écran avec un menu en images	Help CSS menu image hover
[ InDesign CS3 ] Alignement différents dans 2 colonnes.
Plus de sujets relatifs à : Alignement des blocs horizontal CSS

Page générée en 0.049 secondes