Modif CSS

WRInaute discret
Bonjour,

Je souhaite modifier le css de mon site sans modifier l'apparence de celui-ci de façon à optimiser quelques liens.

Le site possède 2 colonnes, une à droite et une à gauche, avec une colonne centrale qui comporte le contenu du site.
Dans le code html, le contenu se positionne avant les colonnes de droite et gauche.

Est ce qu'il est possible de faire passer les colonnes droite/gauche avant le contenu sans modifier l'apparence du site ?
Si oui, est ce que je suis obligé de tout refaire ? Ou quelques modif. dans le fichier css suffiront ?

Je découvre le css.

Merci
 
WRInaute accro
Tu peux le faire, il n'y a pas grand chose à modifier au niveau du code source et du css..si tu débrouille bien en 5 minutes c'est plié.
 
WRInaute discret
webinyou a dit:
Essaie :
Code:
#colonne_gauche,#colonne_droite{float:left}
#contenu{float:right}/*facultatif*/
J'ai modifier le code source de ma page main.php de manière à ce que le code de la colonne de gauche soit placé avant le contenu.
Mais je n'arrive pas à habiller correctement le design, la colonne de gauche est totalement invisible alors que la colonne de droite est correctement à sa place ainsi que le contenu. Voici ma feuille style.css :

Code:
#page {width:980px;margin:0 auto;text-align:left;}
#content {float:left;overflow:visible;}
#leftcolumn {float:left}
#rightcolumn {float:right}
#leftcolumn, #rightcolumn {margin-top:-65px;position:relative;z-index:1;}
#leftcolumn {margin-left:-760px;width:200px;display:inline;}
#content {margin-left:220px;width:540px;display:inline;margin-bottom:10px;}
#rightcolumn {width:200px;display:inline;margin-left:20px;}
#footer {clear:both;text-align:center;}

Si quelqu'un à une idée ...
:)
 
WRInaute accro
chimoun a dit:
Code:
#content {float:left;overflow:visible;}
Es-tu sûr de l'utilité du float left ici ?
chimoun a dit:
Code:
#leftcolumn {margin-left:-760px;width:200px;display:inline;}
Le problème viens probablement de là...vire le margin-left-760px maintenant que dans le code source c'est avant le contenu.
Si tu as une url ca sera + rapide que de faire des suppositions.
 
WRInaute discret
chimoun a dit:
Code:
#page {width:980px;margin:0 auto;text-align:left;}
#content {float:left;overflow:visible;}
#leftcolumn {float:left}
#rightcolumn {float:right}
#leftcolumn, #rightcolumn {margin-top:-65px;position:relative;z-index:1;}
#leftcolumn {margin-left:-760px;width:200px;display:inline;}
#content {margin-left:220px;width:540px;display:inline;margin-bottom:10px;}
#rightcolumn {width:200px;display:inline;margin-left:20px;}
#footer {clear:both;text-align:center;}

Si quelqu'un à une idée ...
:)

Tu mélanges trop de choses. C'est la raison pour laquelle ça ne fonctionne pas... Par exemple on n'utilise pas de "width" avec un "display:inline", car "with" n'a aucun effet sur un "display:inline".

Je te propose de :
- tout nettoyer les #leftcolumn, #rightcolum et #content => { }
- ajouter "float" comme indiqué dans mon premier message
- ajouter "width"
- ajouter "margin" et/ou "padding"

Voilà, rien de plus.
 
Discussions similaires
Haut