CSS problème de mise en page.

Résolu
kitsuo Messages postés 24 Date d'inscription   Statut Membre Dernière intervention   -  
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour tout le monde !

Je fais un site internet et j'ai un souci avec la mise en page.
Je m'explique : j'ai un menu sur le côté gauche qui reste fixe. à droite de celui là j'ai une zone de texte normale, ou j'ai du texte, un tableau, etc. Et mon souci c'est que quand je redimensionne la page (quand je la rétrécit), le texte se mets derrière le menu. Quand la page est en plein écran, tout vas bien, les dimensions sont respectées.
J'imagine que la réponse est assez facile mais je n'arrive pas à la trouver, si quelqu'un à une idée, je lui serais très reconnaissant :D !!

Merci par avance !

A voir également:

3 réponses

Réponse 1 / 3
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
salut

voici un exemple a adapter

#gauche {
position:fixed;
width:200px;
}

#droite {
position relative;
width:100%;
padding-left: 210px;
}
1
Réponse 2 / 3
kitsuo Messages postés 24 Date d'inscription   Statut Membre Dernière intervention  
 
Merci de ta réponse, mais j'avais déjà testé cette solution, je l'avais pas retenue parce que quand on redimensionne la fenêtre (quand je la rends plus petite) le petit ascenseur apparait en bas, et quand on le fait rouler, le tableau s'affiche quand même derrière la sidebar.
J'espère que j'arrive à me faire comprendre, pas évident de décrire :/...

--
0
Réponse 3 / 3
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
ce que tu décris ne vient pas du code que je t'ai donné.

si dans #droite tu mets un contenu à largeur fixe (le tableau certainement) quand tu vas réduire la fenêtre et que le width effectif d'affichage de #droite va être inférieur au width du tableau ou de tout autre élément à largeur fixe: un scrol va se former, les padding ne vont plus être respectés.

essaie donc de faire rentrer un carré de 20 x 20 dans une ouverture de 15 X 15
l'ouverture va se casser (scroll et padding plus respecté)

les solutions

-tout contenu dans droite doit être en width avec %
-tu peux rajouter un min-width en px à #droite
-droite à un largeur fixe en px
0