+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : Interface CSS3 / IE 9 (/showthread.php?tid=5928)
Interface CSS3 / IE 9 - Wells - 17-01-2012
Bonjour à tous, j'ai un cas de conception CSS très compliqué qui est en train de me rendre fou.
La démo : c'est ici
Ca fonctionne très bien sous tout les navigateurs sauf IE9.
Plusieurs soucis :
- Mon tableau ne se rezise pas à 100% de la page mais dépasse en bas
- la colonne de gauche qui devrait s'agrandir pour combler ce qui manque, ne le fait pas
Le but étant que l'interface s’adapte a la taille de la fenêtre (faite le test sous FF par exemple)
Je suis peu être passé à coté de qq chose, alors je soumet ca à vos yeux d'aigles
RE: [COMPLEXE] Interface CSS3 / IE 9 - Maks - 17-01-2012
Code :
<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%">avec un doctype html 5 :'(
A plusieurs endroit tu fermes 3 fois des div je ne vois pas pourquoi, essaye de corriger ça
RE: [COMPLEXE] Interface CSS3 / IE 9 - niahoo - 17-01-2012
tu peux aussi utiliser des media queries si c'est la taille de la fenêtre qui importe
RE: [COMPLEXE] Interface CSS3 / IE 9 - Wells - 18-01-2012
Oui, je sais, des tableaux pas beau tout ca ^^
Mais pour avoir une hauteur dynamique en DIV, sur tous les navigateurs, ca reste le plus simple.
Sauf que ca marche pas sous IE, je pense pas que ca viennent d'un div mal fermer, mais plutot une interférence avec le rowspan
RE: [COMPLEXE] Interface CSS3 / IE 9 - Sephi-Chan - 18-01-2012
Le "complexe" dans le titre est vachement subjectif quand même. :p
Tes exigences en terme de compatibilité avec IE, c'est IE9 et + ? Ça nous permettra de répondre à tes besoins de manière un peu plus efficace et élégante.
Tu as également les marges, qui ne sont pas très bien : elles grandissent au fur et à mesure de l'agrandissement de la fenêtre.
Je vais essayer de proposer une meilleure version (d'ici à ce week-end).
RE: [COMPLEXE] Interface CSS3 / IE 9 - Roworll - 18-01-2012
Un petit code pondu en 5mn.
Avec une base de ce genre et un peu de boulot, tu devrais pouvoir réussir à faire ce que tu veux, en t'affranchissant au passage des tableaux.
Testé et fonctionnel sous FF, IE, Opera , Chrome et safari.
Sinon, y'a comme une inspiration STO dans ton design. Je me trompe ?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style>
div.head {
border
olid black 1px;
position:absolute;
top:1px;
left:1px;
right:1px;
height:40px;
}
div.col-l {
borderolid black 1px;
position:absolute;
top:42px;
left:1px;
bottom:32px;
width:100px;
}
div.col-r {
borderolid black 1px;
position:absolute;
top:42px;
right:1px;
bottom:32px;
width:20px;
}
div.foot {
borderolid black 1px;
position:absolute;
bottom:1px;
left:1px;
right:1px;
height:30px;
}
div.content {
background:lightgrey;
position:absolute;
top:43px;
bottom:33px;
left:103px;
right:23px;
}
</style>
</head>
<body>
<div class="head">1</div>
<div class="col-l">2</div>
<div class="col-r">3</div>
<div class="foot">4</div>
<div class="content">My content Here</div>
</body>
</html>RE: [COMPLEXE] Interface CSS3 / IE 9 - Wells - 18-01-2012
Oui pour IE ca sera 9+ en espérant que le 10 gérera enfin nativement les bords arrondies, les shadow et autre gradiant (on peut tjs rêver non?)
Roworll ton code est pas mal c'est vrai, mais il est beaucoup plus simple que mon rendu.
Que se soit horizontalement ou verticalement, j'ai des boutons, dont le nb est indéterminée.
Ils prennent la place qu'ils prennent (non connu au départ) et le design doit compléter vers le bout de la page et vers le bas tout seul.
Le tout en mettant des espace fixes entre les boutons.
Je te laisse plancher sur le sujet ^^
PS: oui très grosses reprise de STO qui a un design sobre et très efficace je trouve
RE: [COMPLEXE] Interface CSS3 / IE 9 - Sephi-Chan - 18-01-2012
Comment ça doit se comporter quand il y a beaucoup de boutons ?
Et quand on réduit beaucoup la fenêtre ?
RE: [COMPLEXE] Interface CSS3 / IE 9 - Wells - 18-01-2012
1024 mini, je gère pas les écrans en dessous. Pour le haut, il n'y aura pas plus de boutons, mais possiblement moins.
Pour le cote, il n'y aura jamais assez de boutons pour tt remplir, mais le nb reste variable.
RE: [COMPLEXE] Interface CSS3 / IE 9 - Maks - 18-01-2012
Citation :Oui pour IE ca sera 9+ en espérant que le 10 gérera enfin nativement les bords arrondies, les shadow et autre gradiant (on peut tjs rêver non?)
C'est déjà le cas :heu: (sauf pour les gradient)