CSS disparu

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
ChristianTrambly
Salamandre
Messages : 28
Inscription : 20 févr. 2010, 09:02

CSS disparu

Message par ChristianTrambly »

Bonsoir,
Mon site en construction : elevage.l.gatille.free.fr
Coup de theatre:CSS n'est plus lié à mes pages pourtant :

<head>
<title>elevage_laurent_gatille_avendre</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="description" content="">
<meta name="keywords" content="" lang="">
<meta http-equiv="Content-Language" content="">
<meta name="reply-to" content="">
<meta name="category" content="">
<meta name="robots" content="">
<meta name="distribution" content="">
<meta name="revisit-after" content="">
<meta name="author" content="" lang="">
<meta name="copyright" content="">
<meta name="generator" content="">
<meta name="identifier-url" content="">
<meta name="expires" content="">
<meta name="Date-Creation-yyyymmdd" content="">
<meta name="Date-Revision-yyyymmdd" content="">
<link rel="stylesheet" media="screen" type="text/css" title="Design"
href="Laurent.css">
</head>

et voici ma page CSS:
#body {
margin: 0px auto;
background-color: #0e100d;
width: 918px;
}
#conteneur {
border: 5px solid #003300;
margin: auto;
width: 750px;
opacity: 0.89;
}
#entete {
border-left-style: solid;
background-position: center center;
height: 102px;
color: white;
font-style: italic;
background-color: white;
background-repeat: no-repeat;
width: 750px;
font-family: Arial;
margin-top: 10px;
background-image: url(images/audour_banniere_et_texte.gif);
#entetepage1 {
border-style: none none solid;
border-color: red black red -moz-use-text-color;
height: 292px;
background-position: center center;
width: 750px;
background-repeat: no-repeat;
background-image: url(images/audour.gif);
}
#menu {
border-style: hidden;
color: black;
float: none;
font-weight: bold;
text-align: center;
width: 750px;
font-style: italic;
background-color: #87876b;
}
#texte {
border-style: none;
border-color: #ffccff;
background-color: #b8b893;
width: 750px;
font-style: oblique;
}
#textepage1 {
border: none;
background-image: url(images/veau.jpg);
margin-left: 0px;
background-position: center center;
height: 488px;
background-repeat: no-repeat;
width: 750px;
}
#pied {
border-style: solid none none;
border-color: black #ffcc66 #ffcc66 #ffcc33;
border-top: 5px solid black;
text-align: center;
background-color: #b8b893;
margin-top: 10px;
margin-bottom: 10px;
}

mais quand je clique sur l'icone " editeur CSS" le tableau de gauche ne correspond pas avec seulemnt #body, #contener et #entete

j'ai relancé Kompozer mais rien n'y a fait

Bon courage et Merci d'avance

Christian
Votre Navigateur : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:25.0) Gecko/20100101 Firefox/25.0
Asumbaa
Tyrannosaurus Rex
Messages : 2411
Inscription : 08 déc. 2004, 20:07

Re: CSS disparu

Message par Asumbaa »

Salut,

Ne mets pas l'attribut title sur l'élément link.
Il sert uniquement en cas de feuilles de styles alternatives. A priori là tu dois pouvoir choisir "Design" dans Affichage > Style de la page (mais ce n'est pas ce que tu souhaites, je suppose ^^ donc retire le title)
Votre Navigateur : Mozilla/5.0 (X11; Linux i686; rv:21.0) Gecko/20100101 Firefox/21.0
ChristianTrambly
Salamandre
Messages : 28
Inscription : 20 févr. 2010, 09:02

Re: CSS disparu

Message par ChristianTrambly »

Bonsoir

Merci pour votre réponse
Mes 4 autres sites ont cette même anomalie mais ça fonctionne ...

Alors, j'ai regardé la feuille CSS et j'ai trouvé qu'une " } " s'est faite la malle à la fin de #entete juste avant #entepage1
(voir ma question d'origine)
Je l'ai rajouté et ça fonctionne

J'ai une autre question et si la réponse vous sautait aux yeux ce serait super: je ne maitrise pas les espacements entre #menu, #texte et #pied de page
pourquoi ? il ne devrait pas en avoir ou au-moins à distance que je déciderais ... à Mais...

site : elevage.l.gatille.free.fr

Merci d'avance

Christian
Votre Navigateur : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:25.0) Gecko/20100101 Firefox/25.0
Asumbaa
Tyrannosaurus Rex
Messages : 2411
Inscription : 08 déc. 2004, 20:07

Re: CSS disparu

Message par Asumbaa »

Salut,

Ce doit être une histoire de marges par défaut dans les navigateurs.
Pour ton menu c'est la marge verticale par défaut de h1 que tu vois ; sur ton pied de page tu as mis un margin vertical de 10px, donc là c'est toi qui maîtrises.
Votre Navigateur : Mozilla/5.0 (X11; Linux i686; rv:21.0) Gecko/20100101 Firefox/21.0
ChristianTrambly
Salamandre
Messages : 28
Inscription : 20 févr. 2010, 09:02

Re: CSS disparu

Message par ChristianTrambly »

Bonsoir,

Merci pour votre réponse

Et bien , j'ai reconstruit ma mage ligne par ligne en source et tout est propre
Juste une chose , je voudrais positionner le logo "kompozer" tout en bas de la div "texte"
mais je n'ai pas trouvé dans le forum...

voici ma page pour votre compréhension : elevage.l.gatille.free.fr/indexpropre.html

merci d'avance

Christian
Votre Navigateur : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:25.0) Gecko/20100101 Firefox/25.0
Asumbaa
Tyrannosaurus Rex
Messages : 2411
Inscription : 08 déc. 2004, 20:07

Re: CSS disparu

Message par Asumbaa »

Salut,

Pour placer un élément tout en bas d'un de ses parents, il faut :
1/ positionner le parent. donc s'il n'a pas de position: dans la CSS, lui mettre un position: relative (qui ne change rien pour lui, mais il devient référent de position pour ses enfants)
2/ positionner l'élément en absolu dans son parent, via position: absolute; bottom: 0;

Attention du coup le logo Kompozer sera hors du flux naturel, ce qui fait que si tu as un texte qui atteint le bas de ton cadre, il est susceptible de passer *sous* le logo. Ça se règlera simplement avec une marge interne basse sur div#texte.

Voilà ce que ça pourrait donner (il te faudra adapter tes sélecteurs et les positions)

Code : Tout sélectionner

div#texte {
    position: relative;
    padding-bottom: 20px;
}
img#kompozer {
    position: abolsute;
    bottom: 0;
    left: 15px;
}
Votre Navigateur : Mozilla/5.0 (X11; Linux i686; rv:21.0) Gecko/20100101 Firefox/21.0
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 1 invité