28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'aimerais créer un style qui ressemblerai en fait à l'ancien système de frameset qui avait plein d'inconvéniants.

Du point de vu disposition, j'ai ce qu'il me faut.
Par contre j'en viens à mon problème, dès que le contenu de "corps" dépasse la page, c'est toute la page qui est scroolée.
Exemple explicite : http://www.maisons-barberousse.fr/test/nouvelle_version_2.0/Untitled-3.php
Donc j'aimerai seulement que "corps" scroole...

mon code css :

<style type="text/css">
html, body{
height:100%;
width:100%;
margin:0px;
padding:0px;
background-image:url(images/fonts/fond3_topFrame.gif);
}

div#conteneur{
height:100%;
width:100%;
position:absolute;

}


div#header{
height:223px;
}

div#menu{
position:absolute;
left:0;
width:120px;

}
div#corps{
margin-left:120px;
padding-right:10px;
padding-left:10px;
padding-bottom:10px;
max-height:100%;

overflow:auto;
}

</style>


Merci d'avance pour vos suggestions
Modifié par seb67110 (12 Jan 2008 - 23:27)
Bonjour,

Le overflow: auto sur div#corps ne sera pas pris en compte car... le contenu de div#corps ne dépasse tout simplement pas de son conteneur. Pour que le contenu de div#corps en dépasse, il faudrait que div#corps ait une hauteur fixe (height) ou une hauteur maximale (max-height).

Le problème que tu vas rencontré, c'est que tu n'as pas de moyen pleinement compatible avec les principaux navigateurs du marché pour dire à div#corps qu'il doit prendre «toute la hauteur de la fenêtre moins les 223px de div#header». Théoriquement ça peut se faire grâce au positionnement absolu et à top: 223px; bottom: 0, mais ça n'est pas compatible IE6.

Plus généralement, je déconseille ce type de mise en page:
- casse-gueule à mettre en place;
- posant de gros problèmes d'ergonomie (barre de défilement interne chiante à utiliser -- notamment pour les habitués de la molette --, et surtout restriction drastique de la hauteur disponible pour l'affichage du contenu réel du site).

Mais ce n'est que mon avis, et je ne suis pas expert ergonome.
(On visualisera tout de même le rendu en 800x600 pour voir à quel point div#header ampute la zone d'affichage du navigateur d'un espace de respiration salutaire.)
Merci tout d'abord pour ta réponse.

Ta solution pour div#corps fonctionne mais effectivement ça pose le problème de compatibilité.

Que me conseillerais tu comme mise en page en partant au départ sur ceci :
http://www.maisons-barberousse.fr

Tu peux voir que j'avais utilisé des frames, c'est pour ça que je veux tout remodeler.

Donc si t'aurais une autre idée de présentation je pourrai toujours leur proposer...

Merci d'avance
Hmm... je conseillerais une refonte graphique et technique (pas de frames, structure de site «classique» pour avoir une ergonomie correcte). En l'état, on a un bandeau énorme qui:
- a une sale gueule (le logo n'est pas terrible, l'intégration dans la bannière est mauvaise, les photos sont loin d'être mises en valeur, bien au contraire!);
- réduit artificiellement la hauteur disponible pour visualiser les contenus réels du site.

Donc: ne pas faire de bandeau fixe (plutôt réservés à des interfaces spécialisées où conserver en permanence à l'écran certains outils est utile), faire appel à un graphiste, virer les frames, refondre tout ça. Smiley smile
Merci de tes conseils.

Justement le client a fait appel à un infographiste de la famille pour s'occuper de cela. Moi je m'occupe que de la partie "code" donc pour ce qui est du graphisme et de la mise en valeur des photos, je peux pas faire grand chose. C'est vrai qu'il faut espérer que personne n'est en 800*600 :d

Pour ce qui est des frames elles sont virés mais j'ai a peu près fait la meme chose en css. C'est ce qu'ils veulent et veulent rester sur cette présentation alors...
De toute façon je cherche pas à faire un site de groupe internationnal, c'est une PME qui travail seulement dans le bas-rhin et un peu dans la moselle alors...

Mais si t'aurais un exemple visuel de ce que pourrait être mon site je suis preneur.

Encore merci pour tes suggestions Smiley cligne
seb67110 a écrit :
Mais si t'aurais un exemple visuel de ce que pourrait être mon site je suis preneur.

Eh bien, si j'étais graphiste c'est là que je te proposerais un devis. Smiley cligne
ok Smiley biggrin lol
bein en tout cas merci pour tout !
Smiley cligne

Je marque le sujet résolu
seb
Modifié par seb67110 (10 Jan 2008 - 18:48)
Je change de style... 35% des personnes utilisaient ie6 en 2007 sur ce site...
Encore merci
Modifié par seb67110 (13 Jan 2008 - 18:58)