28172 sujets
CSS et mise en forme, CSS3
Fletch91 a écrit :
Bonjour
tout le monde. Voila mon probleme: j'ai créer un page web et en dessous
de mon "pied de page" il y a un grand espace vide que je voudrais enlever.
Je me doute que je dois regler ca dans le css mais j'essaie tout essayer et je ne vois plus quoi faire.Merci d'avance pour votre aide.
Bonsoir itou,
Avec la meilleure volonté du monde...nous ne voyons rien non plus...
Une page en ligne, l'intégralité du code (html/css) ?
Cdt,
Sylvain
Voici le code css
Puis mon code html:
Je ne met pas les details du html parce que c un peu long et puis je ne pense pas que ca reglera le probleme,du moins je pense.
Merci d'avance de votre aide.
body
{
width: 975px;
height:2000px;
margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
background-color: #f9fffd; /* Une petite image de fond pour éviter d'avoir un vieux fond blanc [langue] */
margin-left:auto;
margin-right:auto;
clear:both;
}
#droite
{
position:fixed; top:0px; right:0px;
width:975px;
height:700px;
background: url("images/degrad4.png") repeat-y right;
}
#gauche
{
position:fixed; top:0px; left:0px;
width:975px;
height:700px;
background: url("images/degrad3.png") repeat-y top left;
}
img{border:none;}
#en_tete
{
height: 60px;
background-image: url("images/titlepetit.png");
background-repeat: no-repeat;
margin-bottom: 5px;
}
#edito
{
font-size:.8em;
text-indent: 30px;
text-align: justify;
width: 370px;
height:320px;
position:relative; left:0px; top:-0px;
background-color: #f5f6fd;
border: 0.8px solid black;
margin-bottom: 10px; /* Pour éviter que les éléments du menu ne soient trop collés */
padding-bottom: 5px;
padding-left: 10px;
padding-right: 5px;
margin-top:0px;
}
#signature
{
width:180px;
background-image: url("images/sign.png");
height:60px;
position:relative;
left: 260px; top:8px;
}
#reagissez
{
float:left;
text-decoration:none;
position:relative; top:38px;
color:black;
}
#menucinema
{
position:relative;
left: 390px; top:-1390px;
font-size:.8em;
text-decoration:none;
overflow: auto;
width: 290px;
height: 170px;
margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
color: #00334c;
background-image: url("images/degrad.png");
background-repeat: repeat-y; /* Une petite image de fond qui se répètera horizontalement en haut */
border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
margin:10px;
}
#cinema
{
position:relative;
left: 390px; top:-1401px;
font-size:.8em;
text-decoration:none;
overflow: auto;
width: 290px;
height: 1400px;
margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
color: #00334c;
background-image: url("images/degrad.png");
background-repeat: repeat-y; /* Une petite image de fond qui se répètera horizontalement en haut */
border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
margin:10px;
}
#cinema ul a
{
text-decoration:none;
position:relative;
right:30px;
color:#00334c;
}
#cinema ul a:visited
{
text-decoration:none;
color:#00334c;
}
.titre_affiche_film
{
font-variant: small-caps;
font-weight: bolder;
font-size: 1.4em;
color:#00334c;
}
.affichefilm
{
float:left;
position:relative;
right:40px;
margin:2px;
}
#filmaffiche
{
text-align:center;
text-decoration:underline;
font-size: 1.6em;
color:black;
}
#filmselect
{
position:relative;
top:76px; right:25px;
background-color:#c9e1f3;
float:right;
width:150px;
font-size:.9em;
}
#selection
{
position:relative;
top:66px; right:25px;
background-color:#c9e1f3;
float:right;
width:150px;
font-size:.9em;
}
#clap
{
position:relative;
left: -10px; top:-10px;
float:left;
}
ul
{
list-style-type : none;
}
#menuseries
{
position:relative;
left: 690px; top:-1168px;
font-size:.8em;
text-decoration:none;
overflow: auto;
width: 270px;
height: 200px;
margin-left: 10px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
color: #00334c;
background-image: url("images/degrad2.png");
background-repeat: repeat-y; /* Une petite image de fond qui se répètera horizontalement en haut */
border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
margin:10px;
}
#series
{
font-size:.8em;
overflow: auto;
position:relative;
left: 27px; top:-1209px;
width: 270px;
height: 1400px;
float: right;
margin-left: 20px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-right: 20px;
margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
color: #00334c;
background-color: #ffffff; /* Une couleur de fond pour le corps */
background-image: url("images/degrad2.png");
background-repeat: repeat-y;
border: 1px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}
#series li
{
position:relative;
right:35px;
}
#series ul a
{
text-decoration:none;
}
#serieselect
{
position:relative;
top:8px;
background-color:#ddf9dc;
float:right;
width:150px;
font-size:.9em;
}
.titre_affiche_serie
{
font-variant: small-caps;
font-weight: bolder;
font-size: 1.4em;
color:#104d1a;
padding-left:4px;
}
.saison
{
color:#187100;
font-size:1em;
padding-left:4px;
}
.afficheserie
{
float:left;
border:none;
}
#serielogo
{
float:left;
position:relative;
left: -10px; top:-10px;
}
#menucinema h1, #menuseries h1 /* Tous les titres h1 du corps */
{
color: #00334c;
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
font-size:.8em;
}
#deco1
{
background-image: url("images/deco.png");
position:relative;
top:-1700px; left:0%;
height:290px;
width:430px;
background-repeat: no-repeat;}
#pied_de_page
{
position:relative;
top:-1400px; left:0%;
padding: 0.001px;
text-align: center;
color: #00334c;
background-color: #efffeb;
border: 1px solid black;
}
/*reagissez*/
#grandoeil
{
width:500px;
height:100px;
position:relative;
top:-900px; left:250px;
padding-right:200px;
border: 1px solid black;
}
#grandoeil img
{
float:left;
}
#commentaire
{
position:relative;
top:-800px; left:250px;
}
.note1
{
color:green;
font-weight:bolder;
font-size:1.4em;
}
.note2
{
color:orange;
font-weight:bolder;
font-size:1.4em;
}
.note3
{
color:red;
font-weight:bolder;
font-size:1.4em;
}
#toplist
{
background-image: url("images/bloc.png");
background-repeat: no-repeat;
font-size:1em;
width: 415px;
height:800px;
position:relative; left:-10px; top:20px;
padding-left: 20px;
padding-top:20px;
}
#plus
{
position: relative; top:-10px;
width: 315px;
height:280px;
list-style-image: url("images/plus.png");
margin-left:17px;
font-weight:bold;
color:#0a3900;
}
#moins
{
width: 315px;
height:295px;
list-style-image: url("images/moins.png");
margin-left:17px;
font-weight:bold;
color: #650a00;
position: relative; top:40px;
}
.topcomment
{
color:black;
font-size:.8em;}
Puis mon code html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Baya's - Bienvenue dans mon espace Cinema et Series TV</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Essai" href="style.css" />
</head>
<body>
<div id="en_tete">
<?php
include("en_tete.php");
?>
</div>
<hr/>
<?php
include("onglets.php");
?>
<div id="edito">
<?php
include("edito.php");
?>
</div>
<div>
<?php
include("toplist.php");
?>
</div>
<?php
include("series.php");
?>
<?php
include("cinema.php");
?>
<div id="deco1"></div>
<div id="pied_de_page">
<?php include("pied_de_page.php");?>
</div>
</body>
</html>
Je ne met pas les details du html parce que c un peu long et puis je ne pense pas que ca reglera le probleme,du moins je pense.
Merci d'avance de votre aide.