[CSS]Centrer son site Web sur le forum Création de sites web - 23-04-2012 14:36:18 - page 2

Liste des sujets

[CSS]Centrer son site Web

Fire_Storm

Niveau 10

23 avril 2012 à 14:36:18

Footer n'existe pas, #Contenu non plus par contre #footer et #contenu existent bien -> en gros la casse à son importance.

killahblup

Niveau 8

23 avril 2012 à 14:36:29

Aussi dans ton HTML certaines balises sont nommées en minuscules alors que dans ton CSS elles commencent toutes par une capitale

killahblup

Niveau 8

23 avril 2012 à 14:36:57

Oups tu m'as devancer xD

Fire_Storm

Niveau 10

23 avril 2012 à 14:37:20

Pas grave, au moins il a compris. ^^

NasserKhelaifi

Niveau 10

23 avril 2012 à 14:37:53

Raah je vais test sa , je vous dis

NasserKhelaifi

Niveau 10

23 avril 2012 à 14:43:12

Nan toujours pas

Fiche HTML:
<html>
<head>
<title> Photos
</title>
<link rel="stylesheet" media="screen" type="text/css" href="Style/style.css" />
</head>

<body>

<?php
include (`Connexion.php`)
?>

<a href="Présentation.htm">Accueil</a>
<a href="ClientCours.htm">Client/Cours</a>
<a href="Photo.htm">Photo</a>
<a href="Formulaire.html">Formulaire</a>
<a href="Administrateur.htm">Admin</a>

</div>

Cette page est vide pour le moment . Veuillez nous excuser pour la gene occasionné.

</div>

<div id="Footer">
KAD Copyright - Tout droits réservés 2012

</div>
</div>

</body>
</html>

Fiche CSS:

body
{
background-color: #546750;

}

Conteneur

{
margin: auto;
width : 850px;

}

Header

{
background-image: url("../image/header.jpg");
width: 850px;
height:346px;
margin: auto;
}

{
background-image: url("../image/menu.jpg");
width: 850px;
height: 30px;
text-align: center;
font-size: 16px;
padding-top: 5px;
margin: auto;

}

Menu a

{
color: white;
text-decoration: none;
margin-left: 20px;
margin-right: 20px;
position: relative;
}

Menu a:hover

{
text-decoration: underline;
}

Ombre

{
background-image: url("../image/ombre.jpg");
width: 850px;
height: 93px;
margin: auto;

}

#Corps
{
background-image: url("../image/middle.jpg");
background-repeat: repeat-y;
width: 850px;
padding-left: 50px;
padding-right: 50px;
margin: auto;
}

#Footer
{
background-image: url("../image/footer.jpg");
width: 850px;
height: 100px;
text-align: center;
padding-top: 40px;
color: #FEFEFE;
margin: auto;

}

NasserKhelaifi

Niveau 10

23 avril 2012 à 14:43:57

J'ai tout vérifie en prenant compte de vos remarque et sa marche toujours pas

killahblup

Niveau 8

23 avril 2012 à 14:44:02

Bon attend je vais tester chez moi voir ce que ça donne

NasserKhelaifi

Niveau 10

23 avril 2012 à 14:46:48

Okay au passage , merci a vous de prendre sur votre temps pour m'aider , c'est vraiment sympa

killahblup

Niveau 8

23 avril 2012 à 14:48:32

Change de navigateur ton code est bon puisque ça passe nickel sur Chrome et Firefox, mais pas sur ma version d'IE. Donc le problème vient de la. Je ne sais pas si y'a un moyen radical de faire marcher IE ... Sinon ça serait de trouver un hack spécifiquement pour IE, mais tu n'auras jamais le même rendu qu'avec FF ou GC.

vava740

Niveau 10

23 avril 2012 à 14:50:14

Marche impec chez moi, testé sur Chrome.

Enfin je doute qu'IE ne comprenne pas le margin:auto, quand même

NasserKhelaifi

Niveau 10

23 avril 2012 à 14:51:59

Okay je vais voir ce que je peux faire , le soucis c'est que firefox sa me fait sa :

Aaahh sur firefox il est centré o_0

http://hapshack.com/images/wZ4vV.png

killahblup

Niveau 8

23 avril 2012 à 14:53:55

Oui, enfin justement je suis pas bien sur ... En tout cas il interprète beaucoup de choses à sa façon.

Dans tous les cas l'auteur si tu veux un conseil pour éviter de te prendre la tête, développe tes applications pour FF ou Chrome ou Safari, enfin un vrai navigateur , et après si y'a a débuggué occupe toi d'IE

NasserKhelaifi

Niveau 10

23 avril 2012 à 14:56:26

Okay j'en prend note merci beaucoup tout le monde

Quelqu'un sait régler le problème des espaces entre les div ?

killahblup

Niveau 8

23 avril 2012 à 14:58:52

Oui très simplement :

/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

Au début de ton CSS, ça sert en fait à annuler toutes les propriétés par défaut des navigateurs. Par contre il faudra surement faire quelques réajustement après

NasserKhelaifi

Niveau 10

23 avril 2012 à 15:03:32

Merci pour l'astuce , je m'occupe du reste

killahblup

Niveau 8

23 avril 2012 à 15:06:57

You're welcome !

Aide à l'achat Mac
Internet
Macintosh
Création de sites web
Création de Jeux
Linux
Programmation
Steam Deck
Hardware

La vidéo du moment

News JVTech

25 653 spectateurs

Vos jeux vidéo plantent sans raison sur Windows 11 ? Microsoft a identifié une cause possible et a déployé un correctif

C’est le genre de tuile dont on se passerait bien lors d'une session de jeu. Depuis quelques semaines, de nombreux joueurs voyaient leurs jeux fermer brutalement ou refuser catégoriquement de se lancer, le tout accompagnés de messages d'erreur obscurs comme « EXCEPTION_ACCESS_VIOLATION ». Si les regards se sont d'abord tournés vers les traditionnelles mises à jour mensuelles du système d'exploitation, le souci proviendrait en fait de vos accessoires de bureau.

Toutes les news jvtech