rss
Ils ont besoin de votre aide Tous les messages sans réponse
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

[CSS - IE FF] IE bug affichage repeat y

Posté par RoN., le samedi 18 novembre 2006 à 14:27:08
Bonjour à tous!

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; 
}
Répondre à RoN.  Signaler ce message aux modérateurs Aller au dernier message

1


  • 2    Ce message vous semble utile, votez !
  • Ce message ne vous semble pas utile, votez !
  • Signaler ce message aux modérateurs
Ssylvainsab, le samedi 18 novembre 2006 à 14:37:17
Salut.

-Les bordures droite et gauche de la partie centrale du site n'aparaisse pas
Applique un z-index aux deux div qui les contiennent.
Ex :
div#bordure_gauche,div#bordure_droite{z-index:500}

-Le copyright n'est pas centrer verticalement
La je ne vois pas trop ce que tu veux dire.
Tu peux utiliser position:absolute a mon avis.

-Les balises <BR> semblent être ignorer. En effet pas de saut de ligne avant .:: Accueil ::.
Ecris plutôt :
<br />
Le mieux étant d'utiliser les margins et les paddins :
h1{padding-top:2em;}
applique une marge de deux hauteurs de ligne au titre (si c'est bien la balise h1)

Ca marche ?


EDIT :
Ta balise h2 est mal refermée (le deuxième tag devrait être </h2> et non <h2>)
Lorsque tu as besoin d'utiliser plusieurs divs avec le même id, utilise des class.
Chez moi le conteneur principal ne prend pas toute la place (la bordure du bas est dessus).
Pour ca tu peux appliquer un clear:both; au div qui contient la borudre du bas (div#bordureb) Sylvain
   
Répondre à Ssylvainsab

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 RoN., le lundi 20 novembre 2006 à 01:02:07
Merci pour toutes ces informations....

Je vais tester tout ca dés que j'aurais un moment.
Ouai lol , le </h2> je suis trop bete!

Pour le copyright je parle de ce quil y a ecrit en bas. (c Benjamin GONZVA 2006) je vousdrais l'aligner verticalement dans le div#bottom.

J'ai essayer :

vertical-align:center;

sa ne fonctionnai pas...

J'ai donc essayer :

line-height:70px;

qui fonctionne sous firefox et non sous ie.....

MERCI ENCORE d'avoir pris le temps de t'etre attarder sur mon code.
   
Répondre à RoN.
Posez votre question Répondre
Logiciels pertinents trouvés dans les téléchargements
Télécharger Web Developer Toolbar 1.1.6Web Developer Toolbar - WebDeveloper est une extension firefox représentant une formidable boîte à outils pour examiner et manipuler les pages...Catégorie: Extensions Firefox
Licence: Freeware/gratuit
Télécharger Power IE6 3.00Power IE6 - Power IE 6 est compatible avec Internet Explorer 7, c'est un logiciel d'origine canadienne, qui vous permet en quelques...Catégorie: Anonymat/Confidentialité
Licence: Freeware/gratuit
Télécharger IE7 open last closed tab 3.5.0.0IE7 open last closed tab - Quoi de plus énervant lorsqu'on utilise un navigateur que de fermer accidentellement un onglet ! Mozilla Firefox et Opera...Catégorie: Navigateurs
Licence: Freeware/gratuit
Télécharger IE_Kill 2.0IE_Kill - IE_Kill est un petit utilitaire qui permet de fermer instantanément toutes les fenêtres ouvertes par Internet Explorer. Ce...Catégorie: Internet
Licence: Freeware/gratuit
Plus de logiciels gratuits sur « [CSS IE FF] IE bug affichage repeat y »