info
Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss
BorderLayout avec css sur IE7
1 view
Skip to first unread message
1 connu
Nov 3, 2011, 5:10:05 AM11/3/11
to
Bonjour,
J'essaie de faire une mise en page (Nord,Centre,Sud etc), Bref un BorderLayout pour les javanais.
J'utilise pour cela une css trouvée sur internet.
Ca marche bien sur tous les browsers y compris avec IE 8 mais sur IE7 la boite Nord et Sud sont décaller vers l'est de 50 %
Connaisez vous un parade ą ce probleme ?
D'avance merci
L e code html/css :
<!doctype html>
<html>
<head>
<title>Test BorderLayout</title>
<style type="text/css">
body {margin:0; padding:0; height=100%; width:100%;
overflow-y: hidden ; /* fonction microsoft supprimant les ascenseurs sous IE */
overflow-x: hidden ; /* fonction microsoft supprimant les ascenseurs sous IE */
background-color:transparent; /*encart transparent*/
text-align:center ;
}
div { border:1px solid; position:fixed; }
#top { top:0; width:100%; height:5% }
#bottom { bottom:0; width:100%; height:5% }
#middle { height:90%; width:90%; top:5%; left:5%; bottom:5%; right:5px; overflow: auto; }
#left { top:5%; width:5%; height:90%;right:0px; }
#right { top:5%; left:0px; height:90%; width:5%}
</style>
</head>
<body>
<div class="container">
<div id="top">
haut <br />
haut<br />
</div>
<div id="left">
left<br />
left<br />
</div>
<div id="middle">
centre <br />
centre <br />
centre <br />
centre <br />
centre <br />
ascenceur si trop long ...
...
</div>
<div id="right">
right<br />
right<br />
</div>
<div id="bottom">
bottom<br />
bottom<br />
</div
</div>
</body>
</html>
J'essaie de faire une mise en page (Nord,Centre,Sud etc), Bref un BorderLayout pour les javanais.
J'utilise pour cela une css trouvée sur internet.
Ca marche bien sur tous les browsers y compris avec IE 8 mais sur IE7 la boite Nord et Sud sont décaller vers l'est de 50 %
Connaisez vous un parade ą ce probleme ?
D'avance merci
L e code html/css :
<!doctype html>
<html>
<head>
<title>Test BorderLayout</title>
<style type="text/css">
body {margin:0; padding:0; height=100%; width:100%;
overflow-y: hidden ; /* fonction microsoft supprimant les ascenseurs sous IE */
overflow-x: hidden ; /* fonction microsoft supprimant les ascenseurs sous IE */
background-color:transparent; /*encart transparent*/
text-align:center ;
}
div { border:1px solid; position:fixed; }
#top { top:0; width:100%; height:5% }
#bottom { bottom:0; width:100%; height:5% }
#middle { height:90%; width:90%; top:5%; left:5%; bottom:5%; right:5px; overflow: auto; }
#left { top:5%; width:5%; height:90%;right:0px; }
#right { top:5%; left:0px; height:90%; width:5%}
</style>
</head>
<body>
<div class="container">
<div id="top">
haut <br />
haut<br />
</div>
<div id="left">
left<br />
left<br />
</div>
<div id="middle">
centre <br />
centre <br />
centre <br />
centre <br />
centre <br />
ascenceur si trop long ...
...
</div>
<div id="right">
right<br />
right<br />
</div>
<div id="bottom">
bottom<br />
bottom<br />
</div
</div>
</body>
</html>
Pierre Goiffon
Nov 3, 2011, 12:02:04 PM11/3/11
to
Le 03/11/2011 10:10, 1 connu a écrit :
> J'essaie de faire une mise en page (Nord,Centre,Sud etc), Bref un BorderLayout pour les javanais.
> J'utilise pour cela une css trouvée sur internet.
>
> Ca marche bien sur tous les browsers y compris avec IE 8 mais sur IE7 la boite Nord et Sud sont décaller vers l'est de 50 %
> Connaisez vous un parade à ce probleme ?
> J'essaie de faire une mise en page (Nord,Centre,Sud etc), Bref un BorderLayout pour les javanais.
> J'utilise pour cela une css trouvée sur internet.
>
> Ca marche bien sur tous les browsers y compris avec IE 8 mais sur IE7 la boite Nord et Sud sont décaller vers l'est de 50 %
Pour poster votre exemple je vous recommande d'utiliser des sites comme
http://jsfiddle.net
Sinon sur Alsacréations il y a un gabarit qui correspond assez à ce que
vous voulez faire je crois ; c'est le dernier sur cette page :
http://www.alsacreations.com/static/gabarits/liste.html. Je suppose
qu'il fonctionnera de partout ?
1 connu
Nov 4, 2011, 4:08:05 AM11/4/11
to
"Pierre Goiffon" <pgoi...@free.fr.invalid> a écrit dans le message de news: 4eb2bafd$0$24981$426a...@news.free.fr...
> Le 03/11/2011 10:10, 1 connu a écrit :
>> J'essaie de faire une mise en page (Nord,Centre,Sud etc), Bref un BorderLayout pour les javanais.
>> J'utilise pour cela une css trouvée sur internet.
>>
>> Ca marche bien sur tous les browsers y compris avec IE 8 mais sur IE7 la boite Nord et Sud sont décaller vers l'est de 50 %
>> Connaisez vous un parade à ce probleme ?
>
> Pour poster votre exemple je vous recommande d'utiliser des sites comme http://jsfiddle.net
>
Je vais regarder ...
>> J'essaie de faire une mise en page (Nord,Centre,Sud etc), Bref un BorderLayout pour les javanais.
>> J'utilise pour cela une css trouvée sur internet.
>>
>> Ca marche bien sur tous les browsers y compris avec IE 8 mais sur IE7 la boite Nord et Sud sont décaller vers l'est de 50 %
>> Connaisez vous un parade à ce probleme ?
>
> Pour poster votre exemple je vous recommande d'utiliser des sites comme http://jsfiddle.net
>
> Sinon sur Alsacréations il y a un gabarit qui correspond assez à ce que vous voulez faire je crois ; c'est le dernier sur cette
> page : http://www.alsacreations.com/static/gabarits/liste.html. Je suppose qu'il fonctionnera de partout ?
J'aimerais reproduire un vrai BorderLayout : seul le centre scolle pour s'adapter à differents contenus mais le reste (Nord,
Sud,Est,Ouest) doit rester fixe.
C'est pas le cas des ces exemples.
1 connu
Nov 4, 2011, 4:51:33 AM11/4/11
to
J'ai mis mon exemple dans jsfiddle http://jsfiddle.net/totoheros/puBq5/3/
et j'ai reussi à le faire marcher aussi sur IE7 !
Question subsiliaire :
Le centre prend 90 %, chaque autre partie Nord Sud est à 5%.
Est il possible de fixer la taille de ces parties en pixel et que le centre s'adapte en prenant tout l'espace restant ?
Merci
"1 connu" <inco...@bluewin.ch> a écrit dans le message de news: 42d2f$4eb39d8b$55da2360$31...@news.hispeed.ch...
et j'ai reussi à le faire marcher aussi sur IE7 !
Question subsiliaire :
Le centre prend 90 %, chaque autre partie Nord Sud est à 5%.
Est il possible de fixer la taille de ces parties en pixel et que le centre s'adapte en prenant tout l'espace restant ?
Merci
"1 connu" <inco...@bluewin.ch> a écrit dans le message de news: 42d2f$4eb39d8b$55da2360$31...@news.hispeed.ch...
Pierre Goiffon
Nov 4, 2011, 7:15:30 AM11/4/11
to
Le 04/11/2011 09:51, 1 connu a écrit :
> J'ai mis mon exemple dans jsfiddle http://jsfiddle.net/totoheros/puBq5/3/
> et j'ai reussi à le faire marcher aussi sur IE7 !
Quelle solution avez-vous trouvé pour IE7 ?
> J'ai mis mon exemple dans jsfiddle http://jsfiddle.net/totoheros/puBq5/3/
> et j'ai reussi à le faire marcher aussi sur IE7 !
Au passage, je vois que vous avez un doctype HTML5, je ne suis pas sûr
que IE ne bascule pas en mode quirks avec un tel doctype ??
> Question subsiliaire :
> Le centre prend 90 %, chaque autre partie Nord Sud est à 5%.
> Est il possible de fixer la taille de ces parties en pixel et que le centre s'adapte en prenant tout l'espace restant ?
ruse de sioux : css ne prévoit pas de définir une dimension (sur votre
boite #middle) à 100% moins quelques px. Je parlais de ruse, car
certains moyens le permettent... Sur IE < 8 vous avez expression
(http://msdn.microsoft.com/en-us/library/ms537634%28v=vs.85%29.aspx).
Vous pouvez également utiliser JS... Ou je crois que LESS
(http://lesscss.org/) répond à ce genre de besoins.
1 connu
Nov 7, 2011, 3:16:43 AM11/7/11
to
"Pierre Goiffon" <pgoi...@free.fr.invalid> a écrit dans le message de news: 4eb3c954$0$701$426a...@news.free.fr...
> Le 04/11/2011 09:51, 1 connu a écrit :
>> J'ai mis mon exemple dans jsfiddle http://jsfiddle.net/totoheros/puBq5/3/
>> et j'ai reussi à le faire marcher aussi sur IE7 !
>
> Quelle solution avez-vous trouvé pour IE7 ?
La derniere version a base de #top, #middle
>> J'ai mis mon exemple dans jsfiddle http://jsfiddle.net/totoheros/puBq5/3/
>> et j'ai reussi à le faire marcher aussi sur IE7 !
>
> Quelle solution avez-vous trouvé pour IE7 ?
90 % pour le centre marche aussi sur IE7
> Au passage, je vois que vous avez un doctype HTML5, je ne suis pas sûr que IE ne bascule pas en mode quirks avec un tel doctype ??
>
>> Question subsiliaire :
>> Le centre prend 90 %, chaque autre partie Nord Sud est à 5%.
>> Est il possible de fixer la taille de ces parties en pixel et que le centre s'adapte en prenant tout l'espace restant ?
>
> En conservant ce que vous avez mis en place, ça n'est pas possible sans ruse de sioux : css ne prévoit pas de définir une
> dimension (sur votre boite #middle) à 100% moins quelques px. Je parlais de ruse, car certains moyens le permettent... Sur IE < 8
> vous avez expression (http://msdn.microsoft.com/en-us/library/ms537634%28v=vs.85%29.aspx). Vous pouvez également utiliser JS... Ou
> je crois que LESS (http://lesscss.org/) répond à ce genre de besoins.
Je reste avec des %
0 new messages