pb page créée pour résolution 1024 pour adaptation à autre réso

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : pb page créée pour résolution 1024 pour adaptation à autre réso

Rob_73

Euh...

Bonjour !
J'ai créé site qui fonctionne correctement en 1024*768 mais lorsque je passe dans une réso plus forte (ex : 1280..), ça me met une bande de la couleur du fond sur la droite. C'est normal vu que j'ai mis toutes les dimensions et les écarts des div en pixels. N'y aurrait-il pas moyen de centrer toute la page (les trois blocs menu, banniere et corps) pour que ce soit un peu plus correct. J'ai esseyé de tout faire en % mais j'ai souvent des problèmes. Merci !

Publicité

soul__snake

Tu as le lien de ton site ? Sinon ton site est centré à la base ? Car normalement si tu centre tout à la base dans des plus hautes résolution se sera toujours centré ...

soul__snake

Fait voir le code source si le site n'est pas en ligne...

Rob_73

Euh...

je viens de l'hébergé gratuitement, l'adresse est la suivante :
http://roni_clan.kartzone.info
(j'ai utilisé des feuilles de styles css)

dwogsi

Défaillance cérébrale...

Et bien pour centrer le tout, suffit d'y mettre dans un div conteneur, de luis donner une largeur orécise et de mettre les margin left et right à auto.

De plus, pour que ie comprenne bien, faut mettre le text-align du body à center et donc le rétablir à left dans le div conteneur.

Rob_73

Euh...

oui justement le div conteneur il prendrait quelle largeur par exemple pour que ça convienne. Merci pour votre aide !

soul__snake

je sais pas si sa va marcher mais essay sa:

<html>
<head>
<title>Rise Of Nations Invaders</title>
<link rel="stylesheet" media="screen" type="text/css" title="index" href="styles/index.css"/>
</head>
<body>
<div align="center">

<div id="menug">
<img src="images/francep.gif">  <a href="english/index.html"><img

src="images/anglaisp.gif"></a><br /><br />
<a href="index.html">Accueil</a><br /><br />
<a href="membres.html">Membres</a><br /><br />
<a href="resultats.html">Résultats</a><br /><br />

<a href="matchs.html">Matchs</a><br /><br />
<a href="http://roni-clan.darkbb.com/index.forum">Forum</a><br /><br />
<a href="download.html">Téléchargements</a>

</div>

<div id="menud">
<h3>Sites d'autres clans :</h3>
<a href="www.ilclan.bulock.net">IL</a><br />
<a href="www.sok-knights.tk">SoK</a><br />

<a href="www.tnt-clan.tckclan.net">TNT+TCK</a><br />
<a href="www.cbc.aowc.net">CBE</a><br />
<a href="www.fishstickfoundation.com">FSF</a><br />
<a href="www.revolutiongang.net/elite/">Elite</a><br />
<a href="www.deadalli.proboards40.com">DA</a><br />
<a href="www.nrad.net">NRAD</a><br />
<a href="www.soulfingerband.free.fr">Groupe de musique</a><br />

</div>

<div id="banniere"></div>

<div id="corps">
<h1>Accueil</h1>
<p>Bienvenue à tous sur le site du clan <strong>Roni</strong> (Rise Of Nations Invaders). Ce clan est un

clan francophone et accepte tout joueur parlant notre langue et connaissant les bases du jeu. Le clan

<strong>Roni</strong> permettra aux débutants de progresser en apprenant de nouvelles techniques.</p>
<br />

<br />
<br />
<br />
<br />
<br />
<br />

<img src="images/senat.jpg">

</div>

<div id="copyright"><p>© Copyright 2006 Morel - Tous droits réservés</p></div>
</div>

</body>

</html>

Rob_73

Euh...

j'ai modifié, est-ce que tu peux aller voir ce que ça donne, j'ai pas le 1280 sur cet écran. merci encore

Rob_73

Euh...

ça a centré les menus mais bon ça c'est pas grave, je modifierais les divs

soul__snake

ba non sa centre pas le body mais j'avais pas vu le css attend

Publicité

soul__snake

arf j'ai essayé plusieur maniere mais sa centre pas le body juste le texte ... je vais voir ...

Rob_73

Euh...

ok je sais pas si ça peut se faire. Bon moi je vais y aller, merci de m'aider en tout cas, c'est sympa. Je repasse demain

soul__snake

Voilà sa marche pour des résolusions de 1024*768 et + (Mais blem si inférieur à 1024 > Manque le début et la fin en largeur du BODY)

+----------+
| Ton CSS |
+----------+
------------------------------------------------------------------
#menug img
{
border : none;
}
#menud a
{
color : red;
font-weight : bold;
text-decoration : none;
}
#menud a:hover
{
color : white;
}
h2
{
color : red;
font-family : arial;
font-size : 18px;
text-align : left;
text-decoration : underline;
}
table
{
width : 500px;
border-collapse : collapse;
text-align : center;
}
tr, td
{
border : 1px solid red;
color : white;
}
th
{
border : 1px solid red;
color : red;
}
body
{
background-color : black;
}

#global {
position:fixed !important; /* pour MAC ^^ */
position:absolute;
left:50%;
margin-left:-500px;
width:1000px; /* largeur de ton BODY */
}

#corps
{
position : absolute;
width : 600px;
height: 800px;
background-color : black;
border: 1px solid red;
top : 200px;
left : 200px;
text-align : center;
}
#corps p
{
color : red;
text-align : left;
font-family : "trebuchet ms";
font-size : 14px;
}
#corps h1
{
color : red;
font-family : arial;
font-size : 26px;
}

#menug
{
position : absolute;
width : 200px;
height : 800px;
border : 1px solid red;
background-image : url("images/menug.jpg" );
top : 200px;
left : 0px;
padding-top : 40px;
padding-left : 0px;
}
#menug a
{
color : red;
font-family : "trebuchet ms";
text-decoration : none;
font-size : 24px;
}
#menug a:hover
{
color : white;
font-weight : bold;
}
#menud
{
position : absolute;
width : 200px;
height: 800px;
border : 1px solid red;
background-color: black;
top : 200px;
left : 800px;
}
#menud h3
{
color : red;
font-family : "trebuchet ms";
font-size : 14px;
font-weight : normal;
padding-top : 20px;
padding-left : 10px;
text-decoration : underline;
}
#copyright
{
position : absolute;
width : 600px;
height : 100px;
background-color : black;
left : 200px;
top : 1000px;
padding-top : 30px;
}
#copyright p
{
color : red;
text-align : center;
font-family : "trebuchet ms";
}
#banniere
{
position: absolute;
width : 1000px;
height : 200px;
top : 0px;
left : 0px;
background-image : url("images/banniere.jpg" );
}
--------------------------------------------------------------------

+--------------------+
| Sur tes pages web |
+--------------------+
--------------------------------------------------------------------
<html>
<head>
<title>TON_TITRE</title>
<link rel="stylesheet" media="screen" type="text/css" title="index" href="TON_CSS.css">
</head>
<body>
<div id="global">
(les trois blocs menu, banniere et corps...)
</div>
</body>
</html>

Rob_73

Euh...

ok, merci beaucoup, c'est sympa d'avoir passé du temps ! je teste ça, à la prochaine soul_snake.

vomegaz

~Libriste & Gulden Draak fan~

avec css, tu peux definit plusieurs mise en page en fonction de l'interface de sortie: écran1, écran2, imprimante,...

Rob_73

Euh...

ouais, il faut quand meme une fonction js pour connaitre l'affichage de l'utilisateur, j'y ai pensé aussi mais ça aurrait été plus long

gatsu35

Blablaté par Harko

si au passage tu retablissait l'overflow, car moi je ne peux pas naviguer sur ton site, j'ai pas d'ascenseur

FORUM HardWare.fr

Programmation

HTML/CSS

pb page créée pour résolution 1024 pour adaptation à autre réso

Sujets relatifs
Rechargement page	Charger une page après execution du javascript
Pb mise en page css pour impression	recharger une page à partir d'une autre
Est-il possible de charger une page WEB dans une cellule de tableau ?	Faire expirer une page à son ouverture
Recuperation de donnees sur une page intranet	Création d'un Word ou Excel à partir d'une page ASP
Faire refresher la page dans une servlet	Valider une page en xml
Plus de sujets relatifs à : pb page créée pour résolution 1024 pour adaptation à autre réso

Page générée en 0.060 secondes