Probleme html css (débutant sans doute)
ditow
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
Je n'y connais absolument rien, donc je m'y met progressivement.
j'aimerai savoir pourquoi ceci...
...ne fonctionne pas.
Merci beacoup.
Je n'y connais absolument rien, donc je m'y met progressivement.
j'aimerai savoir pourquoi ceci...
<html>
<head>
<style type="text/css">
body {
background-color: white;
}
#center {
position: absolute;
top: 50%;
background-image: url("http://www.lucilemaiseau.com/img/center.jpg");
width: 402px;
height: 91px;
}
#portfolio {
position: absolute;
top: 60%;
background-image: url("http://www.lucilemaiseau.com/img/portfolio.jpg");
width: 402px;
height :39px;
}
#footer {
position: fixed;
bottom: 0;
background-image: url("http://www.lucilemaiseau.com/img/footer.jpg");
width: 682px;
height: 29px;
}
</style>
</head>
<body>
<div id="center"></div>
<div id="portfolio"></div>
<div id="footer"></div>
</body>
</html>
...ne fonctionne pas.
Merci beacoup.
A voir également:
- Probleme html css (débutant sans doute)
- Editeur html - Télécharger - HTML
- Logiciel de programmation pour débutant - Guide
- Logiciel montage vidéo débutant - Guide
- Br html ✓ - Forum Webmastering
- Espace html ✓ - Forum HTML
6 réponses
1. Il manque un doctype : rien de tel pour avoir tout et n'importe quoi dans les différents navigateurs.
2. Positionnements absolus à proscrire : c'est compliqué à gérer quand on débute, et ce n'est pas nécessaire.
3. Mettre des images en background pour afficher des informations importantes (votre nom et votre métier !) est pire que tout d'un point de vue accessibilité et référencement. Il faut écrire les infos importantes "en dur" dans le code html
4. Avez-vous bien appelé ce fichier index.html ? ou (.htm ou .php) ? Car si vous ne voyez que le code, c'est que le navigateur ne l'interprète pas comme du langage html, l'extension du fichier en est peut-être la raison.
2. Positionnements absolus à proscrire : c'est compliqué à gérer quand on débute, et ce n'est pas nécessaire.
3. Mettre des images en background pour afficher des informations importantes (votre nom et votre métier !) est pire que tout d'un point de vue accessibilité et référencement. Il faut écrire les infos importantes "en dur" dans le code html
4. Avez-vous bien appelé ce fichier index.html ? ou (.htm ou .php) ? Car si vous ne voyez que le code, c'est que le navigateur ne l'interprète pas comme du langage html, l'extension du fichier en est peut-être la raison.
j'ai testé et ça marche pourtant :-o enfin je vois un fond blanc avec marqué site en construction et en bas des coordonnées c'est bien ça ? (enfin sous IE je les vois en haut les coordonnées lol)
logiquement au centre y 'a marqué lucile maiseau graphiste independante, en dessous l'adresse de son book et site en construction et en dessous les coordonnées...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
a ta ligne bottom je te conseil d'indiquer une mesure soit 0% ou px mais met quelque chose . après je vois les trois éléments nickel sur IE t'es coordonnée sont en haut car tu es en position fixed change les en absolute utilise un bog ie car ton portfolio est monté sur ton image center et après ça marchera sous IE et (ça marche déjà) sur chrome (que je recommande vivement :D j'aime la pub :D) edit: je trouve dommage que tout soit des images parce que là si on veux soit te contacter soit aller sur ton book faut avoir de la memoir et retenir ton adresse ou avoir un papier un crayon perso je suis feignant :p au moins l'adresse du book ça serait bien ça donnerai ça (sans le truc pour IE)
<html>
<head>
<style type="text/css">
body {
background-color: white;
}
#center {
position: absolute;
top: 50%;
background-image: url("http://www.lucilemaiseau.com/img/center.jpg");
width: 402px;
height: 91px;
}
#portfolio {
position: absolute;
top: 60%;
width: 402px;
height :39px;
}
#footer {
position: absolute;
bottom: 0%;
background-image: url("http://www.lucilemaiseau.com/img/footer.jpg");
width: 682px;
height: 29px;
}
p, a{
font-size:12px;
text-align:center;
color:gray;
text-decoration:none;
}
</style>
</head>
<body>
<div id="center"></div>
<div id="portfolio"><p>SITE EN CONSTRUCTION <br/>
<a href="http://lucilemaiseau-book.com">ici mon book</a></p></div>
<div id="footer"></div>
</body>
</html>
