CSS + résolution ecran...
11 messages
• Page 1 sur 1
Consultez la formation à Google Analytics de WebRankInfo / Ranking Metrics
- Grantome
- WRInaute accro

- Messages: 2899
- Inscription: 16 Jan 2004
CSS + résolution ecran...
Salut,
Voilà mon pb.
Je souhaite faire un cadre avec au centre un contenu.
Le tout doit pouvoir se redimensionner selon la résolution d'écran du visiteur.
La feuille est divisé en 9.
1 2 3
4 5 6
7 8 9
les parties 1 3 7 et 9 sont des images fixe, se sont les angle du cadre.
les parties 2 4 6 et 8 sont des images qui doivent se répéter en fonstion de la largeur et de la hauteur de la page, se sont les bords du cadre.
la partie 5 et mon contenu.
Mon pb, et que soit j'arrive à coder pour faire varier les partie 2 et 8 (en largeur), soit j'arrive à coder pour faire varier les partie 4 et 6 (en hauteur).
Evidement, j'ai déjà parcouru le web en long et en travers, fait les site alsacecreations, openweb, etc... Mais rien trouvé pour mon soucis.
Sibelus, au secour...
Voilà mon pb.
Je souhaite faire un cadre avec au centre un contenu.
Le tout doit pouvoir se redimensionner selon la résolution d'écran du visiteur.
La feuille est divisé en 9.
1 2 3
4 5 6
7 8 9
les parties 1 3 7 et 9 sont des images fixe, se sont les angle du cadre.
les parties 2 4 6 et 8 sont des images qui doivent se répéter en fonstion de la largeur et de la hauteur de la page, se sont les bords du cadre.
la partie 5 et mon contenu.
Mon pb, et que soit j'arrive à coder pour faire varier les partie 2 et 8 (en largeur), soit j'arrive à coder pour faire varier les partie 4 et 6 (en hauteur).
Evidement, j'ai déjà parcouru le web en long et en travers, fait les site alsacecreations, openweb, etc... Mais rien trouvé pour mon soucis.
Sibelus, au secour...
- Grantome
- WRInaute accro

- Messages: 2899
- Inscription: 16 Jan 2004
...
Ahhhh, pas d'URL, c'est du local...
Voici le code:
CSS
Et le HTML
Je te mets un screen se soir si tu veux.
Voici le code:
CSS
- Code: Tout sélectionner
html,body
{
background-image:url(./images/fond.jpg);
margin-top:0; margin-left:0; margin-right:0; margin-bottom:0;
}
#hautgauche {
position: absolute;
left:0;
width:189;
height:44;
background-image:url(./images/parchemin1.gif);
}
#hautcentre {
margin-left: 189px;
margin-right: 203px;
height:44;
background-image:url(./images/parchemin2.gif);
}
#hautdroite {
position: absolute;
right:0;
background-image:url(./images/parchemin3.gif);
width:203;
height:44;
}
#gauche {
position: absolute;
left:0;
background-image:url(./images/parchemin4.gif);
width:51;
height:81;
}
#centre {
background-color:#efe7d6;
margin-left: 51px;
margin-right: 42px;
}
#droite {
position: absolute;
right:0;
background-image:url(./images/parchemin5.gif);
width:42;
height:81;
}
#basgauche {
position: absolute;
left:0;
background-image:url(./images/parchemin6.gif);
width:189;
height:40;
}
#bascentre {
margin-left: 189px;
margin-right: 203px;
height:40px;
background-image:url(./images/parchemin7.gif);
}
#basdroite {
position: absolute;
right:0;
background-image:url(./images/parchemin8.gif);
width:203;
height:40;
}
Et le HTML
- Code: Tout sélectionner
<head>
<link href="./aaa.css" rel="stylesheet" type="text/css">
</head>
<body>
<div>
<div id="hautgauche"></div>
<div id="hautdroite"></div>
<div id="hautcentre"></div>
</div>
<div>
<div id="gauche"></div>
<div id="droite"></div>
<div id="centre">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
ccccccccccccccccccccccccccccccccccccccccccccccccc
dddddddddddddddddddddddddddddddddddddddddddddd</div>
</div>
<div>
<div id="basgauche"></div>
<div id="basdroite"></div>
<div id="bascentre"></div>
</div>
</body>
</html>
Je te mets un screen se soir si tu veux.
- Grantome
- WRInaute accro

- Messages: 2899
- Inscription: 16 Jan 2004
...
Héhhé
Le pb se situe sur les ID gauche et droit
Bon, l'image entre les 2 coin du parchemin varie bien en largeur, mais pas en hauteur.
Tu va me dire, normal, il y a un height de mis, mais en le retirant, en le mettant en auto, ou en plaçant un background-repeat, ça ne change rien.
Le pb se situe sur les ID gauche et droit
Bon, l'image entre les 2 coin du parchemin varie bien en largeur, mais pas en hauteur.
Tu va me dire, normal, il y a un height de mis, mais en le retirant, en le mettant en auto, ou en plaçant un background-repeat, ça ne change rien.
11 messages
• Page 1 sur 1
Formation recommandée sur ce thème :
Formation Google Analytics : en 2 jours, apprenez comment exploiter l'essentiel des possibilités de l'outil de mesure d'audience de Google. Formation animée par les experts Google Analytics de Ranking Metrics.
Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.
Lectures recommandées sur ce thème :
- Détection résolution écran
- Probleme résolution écran
- Résolution écran php et java
- Question ref menu et resolution ecran
- Site en plein écran peu importe la résolution comment faire?
- Résolution d'écran et css
- Adapter un site suivant la résolution de l'écran en CSS
- Script qui charge un css suivant résolution de l'internaute?
- css: garder 3 boîtes sur la même ligne qq soit la résolution
- Hors Sujet - différence ecran TV et écran pour PC
Consultez la description détaillée des produits ou services de Google suivants : Picasa Web Albums, Google Viewer
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités

