Site FullScreen (Width:100% et Height:100%)
Résolu/Fermé
Digit@lChord
Messages postés
129
Date d'inscription
mardi 24 novembre 2009
Statut
Membre
Dernière intervention
5 septembre 2012
-
11 janv. 2012 à 23:09
The Dead T Messages postés 80 Date d'inscription vendredi 24 juillet 2009 Statut Membre Dernière intervention 19 janvier 2012 - 13 janv. 2012 à 10:33
The Dead T Messages postés 80 Date d'inscription vendredi 24 juillet 2009 Statut Membre Dernière intervention 19 janvier 2012 - 13 janv. 2012 à 10:33
A voir également:
- Height:100%;
- Site de telechargement - Guide
- Site inaccessible - Guide
- Site de vente entre particulier - Guide
- Site partage photo - Guide
- Darkino site - Guide
3 réponses
snowflake
Messages postés
82
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
15 janvier 2012
6
Modifié par snowflake le 12/01/2012 à 01:10
Modifié par snowflake le 12/01/2012 à 01:10
premierement background ces pas comme ca on fait mes comme ca background: #fff; ... fff pour blanc.... ya moyen de voir le html svp?
sinon ces ca tu veux faire?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ton_titre</title>
<style type="text/css" media="all">
#header {
background: #747488;
width:100%;
height:108px;
}
#side {
background: #4d4c67;
width:33%;
height:100%;
float:left;
}
#content {
background: #31313f;
width:67%;
height:100%;
float:right;
}
</style>
</head>
<body>
<div id="header">
HEADER
</div>
<div id="side">
SIDE
</div>
<div id="content">
CONTENT
</div>
</body>
</html>
sinon ces ca tu veux faire?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ton_titre</title>
<style type="text/css" media="all">
#header {
background: #747488;
width:100%;
height:108px;
}
#side {
background: #4d4c67;
width:33%;
height:100%;
float:left;
}
#content {
background: #31313f;
width:67%;
height:100%;
float:right;
}
</style>
</head>
<body>
<div id="header">
HEADER
</div>
<div id="side">
SIDE
</div>
<div id="content">
CONTENT
</div>
</body>
</html>
The Dead T
Messages postés
80
Date d'inscription
vendredi 24 juillet 2009
Statut
Membre
Dernière intervention
19 janvier 2012
17
Modifié par The Dead T le 12/01/2012 à 16:24
Modifié par The Dead T le 12/01/2012 à 16:24
Alors, c'est ca que tu voulais? J'ai fait directement une page entière avec le css correspondant comme ca tu peux copier/coller et voir rapidement si c'est ça que tu veux :D
Les noms ne correspondent pas exactement à ce que tu avais commencé à faire mais bon :D
N.B.: SI tu tiens à utiliser height:100%; tu ne peux pas déclarer de doctype, ca ne fonctionnera pas... Mais du coup tu seras en mode natif du coup les différents navigateurs en feront un peu qu'à leur tête... (plus que d'habitude)
Edit 1 : D'ailleurs, test sur firefox et ca devrait fonctionner, mais si tu test sur IE ca ne fonctionne pas ^^
Edit 2 : Sinon tu pourrais regarder avec du javascript, ça doit pas être bien compliqué et ca fonctionnera partout :)
<html>
<head>
<style type="text/css">
body{
width:100%;
height:100%;
padding:0;
margin:0;
}
#header{
background-color:#747488;
width:100%;
height:20%;
}
#menu{
background-color:#4d4c67 ;
width:20%;
height:80%;
float:left;
}
#main{
background-color:#31313f ;
width:80%;
height:80%;
float:right;
}
#clearer{
clear:both;
}
</style>
</head>
<body>
<div id="header">
</div>
<div id="content">
<div id="menu">
</div>
<div id="main">
</div>
<div id="clearer">
</div>
</div>
</body>
</html>
Les noms ne correspondent pas exactement à ce que tu avais commencé à faire mais bon :D
N.B.: SI tu tiens à utiliser height:100%; tu ne peux pas déclarer de doctype, ca ne fonctionnera pas... Mais du coup tu seras en mode natif du coup les différents navigateurs en feront un peu qu'à leur tête... (plus que d'habitude)
Edit 1 : D'ailleurs, test sur firefox et ca devrait fonctionner, mais si tu test sur IE ca ne fonctionne pas ^^
Edit 2 : Sinon tu pourrais regarder avec du javascript, ça doit pas être bien compliqué et ca fonctionnera partout :)
Digit@lChord
Messages postés
129
Date d'inscription
mardi 24 novembre 2009
Statut
Membre
Dernière intervention
5 septembre 2012
8
12 janv. 2012 à 18:56
12 janv. 2012 à 18:56
C'etait sa ! Merci beaucoup ;D
snowflake
Messages postés
82
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
15 janvier 2012
6
12 janv. 2012 à 20:29
12 janv. 2012 à 20:29
ces pas vraiment une bonne solution si ca fonctionne pas sous ie lolllllll
snowflake
Messages postés
82
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
15 janvier 2012
6
12 janv. 2012 à 20:43
12 janv. 2012 à 20:43
la vrai facon de faire ces comme ca et tou sera valide et marchera sous ie et autre et es valide avec w3validator...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ton_titre</title>
<style type="text/css" media="all">
html,body {
margin:0;
padding:0;
height:100%;
}
#header {
background: #747488;
width:100%;
min-height:20%;
}
#side {
background: #4d4c67;
width:33%;
min-height:80%;
float:left;
}
#content {
background: #31313f;
width:67%;
min-height:80%;
float:right;
}
</style>
</head>
<body>
<div id="header">
HEADER
</div>
<div id="side">
SIDE
</div>
<div id="content">
CONTENT
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ton_titre</title>
<style type="text/css" media="all">
html,body {
margin:0;
padding:0;
height:100%;
}
#header {
background: #747488;
width:100%;
min-height:20%;
}
#side {
background: #4d4c67;
width:33%;
min-height:80%;
float:left;
}
#content {
background: #31313f;
width:67%;
min-height:80%;
float:right;
}
</style>
</head>
<body>
<div id="header">
HEADER
</div>
<div id="side">
SIDE
</div>
<div id="content">
CONTENT
</div>
</body>
</html>
The Dead T
Messages postés
80
Date d'inscription
vendredi 24 juillet 2009
Statut
Membre
Dernière intervention
19 janvier 2012
17
13 janv. 2012 à 10:33
13 janv. 2012 à 10:33
En effet, cette façon est plus juste! (A faire attention quand même aux navigateurs IE plus ancien que la version 7)
Tu es mieux d'utiliser celle la Digit@lChord!
Merci à toi snowflake!
Tu es mieux d'utiliser celle la Digit@lChord!
Merci à toi snowflake!
C'est parce qu'il y a des erreurs dans ton css : il faut écrire "background-color:#747488;". Ca ne s'affiche pas car tu as oublié de mettre des points-virgules à la fin du code couleur.
Au final, le code css correct pour faire ce que tu veux, c'est ça :
#header {
background-color:#747488;
width:100%;
height:108px;
}
#side {
background-color:#4d4c67;
width:150px;
height:100%;
float:left;
}
#content {
background-color:#31313f;
width:100%;
height:100%;
}
Au final, le code css correct pour faire ce que tu veux, c'est ça :
#header {
background-color:#747488;
width:100%;
height:108px;
}
#side {
background-color:#4d4c67;
width:150px;
height:100%;
float:left;
}
#content {
background-color:#31313f;
width:100%;
height:100%;
}
