Bonjour à tous,
Alors voilà, je vais vous présenter ma structure :
index.html
page1.html
page2.html
page3.html
basic.css
index.css
page1.css
page2.css
page3.css
Toutes les pages HTML possèdent un basic.css pour le design global.
Puis par la suite elle possède tous une deuxième feuille de style qui leur sont prendre pour mettre en place les icones/textes et autres de chaques pages.
Sur ma page2.html qui utilise donc basic.css et page2.css ( qui lui est vide ), quand je vais visiter cette page , le design , l'ensemble de la page s'agrandit genre 3 à 5 %.
Cependant, sur toute mes autres pages qui utilise basic.css , pas ce problème.
Auriez vous une idée ?
Annexe : basic.css
Annexe 1 : page2.html
Merci par avance
Alors voilà, je vais vous présenter ma structure :
index.html
page1.html
page2.html
page3.html
basic.css
index.css
page1.css
page2.css
page3.css
Toutes les pages HTML possèdent un basic.css pour le design global.
Puis par la suite elle possède tous une deuxième feuille de style qui leur sont prendre pour mettre en place les icones/textes et autres de chaques pages.
Sur ma page2.html qui utilise donc basic.css et page2.css ( qui lui est vide ), quand je vais visiter cette page , le design , l'ensemble de la page s'agrandit genre 3 à 5 %.
Cependant, sur toute mes autres pages qui utilise basic.css , pas ce problème.
Auriez vous une idée ?
Annexe : basic.css
html
{
height:100.1%;
overflow-y: scroll;
}
body
{
margin: auto;
background-image: url("fond.png");
}
/* L'en-tête */
#en_tete
{
height: 142px;
background-image: url("header_fond2.png");
background-repeat: no-repeat;
}
.logo
{
margin-top: 8px;
background-image: url(logo.png);
float: left;
width: 446px;
height: 130px;
}
#menu
{
height: 46px;
}
.element_menu
{
text-align:center;
background-image: url("menu.png");
background-repeat: repeat-x;
height: 36px;
padding-top:10px;
}
.sep1
{
background-image: url(sep_menu_2.png);
float: left;
width: 23px;
height: 36px;
position:absolute;
top:142px;
left:416px;
}
.sep2
{
background-image: url(sep_menu_2.png);
float: left;
width: 23px;
height: 36px;
position:absolute;
top:142px;
left:550px;
}
.sep3
{
background-image: url(sep_menu_2.png);
float: left;
width: 23px;
height: 36px;
position:absolute;
top:142px;
left:613px;
}
.sep4
{
background-image: url(.sep_menu_2.png);
float: left;
width: 23px;
height: 36px;
position:absolute;
top:142px;
left:727px;
}
.sep5
{
background-image: url(sep_menu_2.png);
float: left;
width: 23px;
height: 36px;
position:absolute;
top:142px;
left:862px;
}
.sep6
{
background-image: url(sep_menu_2.png);
float: left;
width: 23px;
height: 36px;
position:absolute;
top:142px;
left:960px;
}
#corps
{
background-image: url("fond_corps.png");
background-repeat: repeat;
min-height: 400px;
}
a
{
text-decoration: none;
color:black;
}
.lien:hover
{
color: #FFFFFF;
text-decoration: none;
}
#pied_de_page
{
height: 38px;
clear: both;
text-align: center;
background-image: url("fond.png");
background-repeat: repeat;
}
.copyright
{
color: #055b98;
text-decoration: none;
}
Annexe 1 : page2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Bienvenue sur mon site !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="basic.css" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="page2.css" />
</head>
<body>
<div id="en_tete">
<!-- Ici on mettra la bannière -->
<div class="logo"> <!-- Cadre correspondant à logo -->
</div>
</div>
<div id="menu">
<!-- Ici on mettra le menu -->
<div class="element_menu"> <!-- Cadre correspondant à un sous-menu -->
<a class="lien" href="7.html">7</a>
<a class="lien" href="6.html">6</a>
<a class="lien" href="5.html">5</a>
<a class="lien" href="4.html">4</a>
<a class="lien" href="3.html">3</a>
<a class="lien" href="2.html">2</a>
<a class="lien" href="1.html">1</a>
<div class="sep1"></div>
<div class="sep2"></div>
<div class="sep3"></div>
<div class="sep4"></div>
<div class="sep5"></div>
<div class="sep6"></div>
</div>
</div>
<div id="corps">
<!-- Ici on mettra le contenu principal de la page (tout le texte quoi) -->
<h3 class="global">Global</h3>
<br />
<img class="barre_sous_titre" src="barre_sous_titre.png">
<br />
<div id="text">
<a href="page3.html" class="3_text">Page 3</a>
<a href="page1.html" class="1_text">Page 1</a>
</div>
<div id="frame_open">
<span class="corner_left_top"> </span>
<span class="corner_right_top"> </span>
<span class="corner_left_bottom"> </span>
<span class="corner_right_bottom"> </span>
<span class="horizontal_top"> </span>
<span class="horizontal_bottom"> </span>
<span class="vertical_left"> </span>
<span class="vertical_right"> </span>
</div>
<br /><br /><br /><br /><br />
</div>
<div id="pied_de_page">
<!-- Enfin, on mettra en bas de la page le nom de l'auteur, un copyright.-->
<p class="copyright">Copyright 2010</p>
</div>
</body>
</html>
Merci par avance
(les pages)