Avant de poster j'ai essayer de chercher si quelqu'un avait le meme probleme que moi et je me suis apercu qu'il y a beaucoup de probleme au niveau des feuilles de style entre ie et ff...
Donc en voila un de plus....
Je débute en css et html et c'est plutot décourageant de voir que dés ma premiere page qui est portant plutot vide il y a deja des problemes sous ie.
Rentrons dans le vif du sujet....
Voici l'url de mon site: http://benjamin.gonzva.free.fr
Sous firefox pas de probleme , sa ressemble à ce que je cherchais à faire.
Sous internet explorer :
-Les bordures droite et gauche de la partie centrale du site n'aparaisse pas.... (Bizard ! Ils aparaissent sur la partie du bas "copyright")
-Le copyright n'est pas centrer verticalement
-Les balises <BR> semblent être ignorer. En effet pas de saut de ligne avant .:: Accueil ::.
Vraiment étrange et décourageant.
J'attend votre soutiens
Merci d'avance !
SOURCES :
index.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<title>Site personnel : GONZVA Benjamin.</title>
<?php
require('meta.html');
?>
<link href="style.css" rel="stylesheet" type="text/css" media="screen">
</head>
<body>
<div id="top"></div>
<div id="body">
<div id="borduret"></div>
<div id="bordureb"></div>
<div id="bordurel"></div>
<div id="bordurer"></div>
<div id="cointl"></div>
<div id="cointr"></div>
<div id="coinbl"></div>
<div id="coinbr"></div>
<BR>
<h1>.:: Accueil ::.</h1>
<h2>Bienvenue sur mon site web.<h2>
<div id="cvhead">
CV HEAD
<div id="cvbody">CV BODY</div>
</div>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<?php
require('bottom.html');
?>
</div>
</body>
</html>
meta.html
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta name="author" content="Benjamin GONZVA"> <meta name="description" content="Site personnel"> <meta name="keywords" content="GONZVA,cv">
bottom.html
<div id="bottom"> <div id="borduret"></div> <div id="bordureb"></div> <div id="bordurel"></div> <div id="bordurer"></div> <div id="cointl"></div> <div id="cointr"></div> <div id="coinbl"></div> <div id="coinbr"></div> <p id="margedroite">© 2006 - GONZVA Benjamin</p> </div>
style.css
*
{
font-family:verdana;
font-size:12pt;
color:white;
}
h1
{
text-align:center;
font-size:26pt;
font-weight:800;
}
h2
{
text-align:center;
font-size:22pt;
font-weight:600;
}
div#top
{
position:absolute;
top:20px;
left:5%;
width:90%; /* Largeur */
height:164px;
background-image:url(header.png);
background-repeat:no-repeat;
background-position:center center;
margin:0;
}
div#body
{
position:absolute;
top:204px;
left:5%;
width:90%;
background-color: #5b6870;
}
div#bottom
{
position:absolute;
bottom:-110px;
width:100%;
height:90px;
background-color:#5b6870;
font-size:8pt;
text-align:right;
line-height:70px;
}
div#borduret
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:26px;
background: url(bordureh.png) repeat;
}
div#bordureb
{
position:absolute;
bottom:0px;
left:0px;
width:100%;
height:26px;
background: url(bordureh.png) repeat;
}
div#bordurel
{
position:absolute;
top:0px;
left:0px;
width:26px;
height:100%;
background: url(bordurev.png) repeat;
}
div#bordurer
{
position:absolute;
top:0px;
right:0px;
width:26px;
height:100%;
background: url(bordurev.png) repeat;
}
div#cointl
{
position:absolute;
top:0px;
left:0px;
width:29px;
height:27px;
background: url(borduretl.png);
}
div#cointr
{
position:absolute;
top:0px;
right:0px;
width:27px;
height:29px;
background: url(borduretr.png);
}
div#coinbl
{
position:absolute;
bottom:0px;
left:0px;
width:27px;
height:29px;
background: url(bordurebl.png);
}
div#coinbr
{
position:absolute;
bottom:0px;
right:0px;
width:29px;
height:27px;
background: url(bordurebr.png);
}
p#margedroite
{
font-size:8pt;
margin-right:40px;
}
div#cvhead
{
position:absolute;
top:175px;
left:100px;
width:400px;
height:50px;
background-color: #ccdde5;
border-width:4px;
border-color:#7d888e;
border-style:solid;
}
div#cvbody
{
position:absolute;
bottom:-265px;
left:-2px;
width:100%;
height:250px;
background-color: #ccdde5;
border-width:2px;
border-color:#7d888e;
border-style:dashed;
}
