CSS + résolution ecran...
11 messages • Page 1 sur 1
Consultez la formation à Google Analytics de WebRankInfo / Ranking Metrics
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...
...
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.
...
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 Julien Coquet, expert certifié officiellement par Google Analytics.
Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.
Lectures recommandées sur ce thème :
- Google crawle les fichiers CSS
- Afficher le PageRank en entier dans Firefox (barre d'outils Google)
- Concours de création de Gadgets pour Live.com
- Comment optimiser la proéminence des mots-clés
- Contrer une redirection 302 intempestive...
- Comment voir facilement les liens nofollow dans Firefox
- Utiliser Actifpub pour l'intégration d'un flux RSS externe sur son site
- Intégrer facilement un flux RSS externe
- Les blogs (Search Engine Strategies 2004 - San José)
- Tutorial Google Maps API
- Hors Sujet - différence ecran TV et écran pour PC
- [SOLUTION] Differencier IE6 IE7 et FIREFOX en CSS
- Cherche une solution pour Scanner les CSS
- presentation plein ecran
- Probleme résolution écran
- Acheter un écran plat
- Ecran de portable transparent
- Nettoyer votre écran
- Gmail.com ecran blanc
- demande d'apercu ecran svp
- Résolution écran php et java
- Travailler en Bi-Ecran (mode étendu)
- Quelle taille ecran pour pc portable
- Cherche script pub plein ecran (a la Allocine)
- Ecran Windows tout petit après redémarrage 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


le forum