Page css externe

fcalmant · Message par **fcalmant** » 18 nov. 2010, 06:52

Bonjour,
Je me lance dans le css et je galère

J'ai créer une feuille externe style.css avec cascades de kompozer, la voici :
* {
margin: 0;
padding: 0;
font-family: georgia;
font-size: 100%;
}
#container {
width: auto;
margin-left: auto;
margin-right: auto;
background-color: #afafaf;
}
#sidebar1 {
float: left;
width: 200px;
color: red;
font-weight: bold;
background-image: url(Ravenalabordercssdroite.JPG);
}
#sidebar2 {
float: right;
width: 200px;
background-repeat: repeat-y;
background-position: left center;
background-image: url(Ravenalabordercss.JPG);
}
#content {
padding: 0px;
background-color: #ffffff;
margin-left: 200px;
margin-right: 160px;
}
div#content {
min-height: 600px;
}
#footer, #header {
background: #e0e0e0 none repeat scroll 0% 50%;
}
#header {
height: 217px;
background-position: center center;
opacity: 0.949;
width: 100%;
background-repeat: no-repeat;
background-image: url(header.jpg);
}
#footer {
height: 120px;
}
h1 {
font-size: 1.8em;
}

Je lie mon html avec cette ligne entre les head <link rel="stylesheet" href="style.css" type="text/css">
</head>

J'upload le tout et....ça ne fonctionne pas!

Help please!!!
Merci!
Fred

Message par **chinon37** » 18 nov. 2010, 08:47

Bonjour,

On peut avoir l'adresse du site?
Tu as bien mis la feuille de style dans le même répertoire que tes pages html ?

teoli2003 · Message par **teoli2003** » 18 nov. 2010, 09:41

Ton serveur web la sert bien avec le type text/css et pas text/plain ou text/html ?

fcalmant · Message par **fcalmant** » 18 nov. 2010, 12:55

Voici la page de test: http://www.exometeofraiture.net/csstest3.html

La feuille est bien dans le même répertoire et le type est text/css

Voici ce que ça devrait donner avec le css inclu dans l'html :http://www.exometeofraiture.net/css.html

Asumbaa · Message par **Asumbaa** » 18 nov. 2010, 13:02

Bonjour,

La feuille de style est bien appelée et s'applique.
C'est le HTML qui ne contient aucune des balises stylées par la CSS

fcalmant · Message par **fcalmant** » 18 nov. 2010, 13:23

Asumbaa a écrit :Bonjour,

C'est le HTML qui ne contient aucune des balises stylées par la CSS

Remède??

Message par **chinon37** » 18 nov. 2010, 13:47

Pour préciser le propos de Asumbaa:
Tu as créé des identifiants (Id caractérisé par un # devant la règle de style). Si tu n'attribues pas ces Id à des balises html, ils ne pourront jamais s'appliquer à la page.

par exemple, au lieu de:

Code : Tout sélectionner

<div style="text-align: center;">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br>
</div>

tu mets:

Code : Tout sélectionner

<div id="header">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br>
</div>

les règles de style de l'Id header s'appliqueront au div en question.
Si tu ne précises pas où doivent s'appliquer les règles de style, le navigateur ne décidera pas de lui-même (et heureusement). Il faut absolument que tu le précises dans la page html.
Tu codes tout à la main sur un éditeur de texte de type Notepad++ ou tu utilises un logiciel comme KompoZer pour créer tes pages? KompoZer permet d'attribuer très facilement des Id ou Class à des éléments html.

fcalmant · Message par **fcalmant** » 18 nov. 2010, 13:50

Merci Chinon, J'ai édité à la main et j'ai pigé le truc! J'utilise Kompozer et ça m'intéresse de connaitre la marche à suivre pour attribuer les id plus facilement!

Asumbaa · Message par **Asumbaa** » 18 nov. 2010, 14:39

Modération : je te passe la main, Chinon, et déplace cette discussion dans le forum Kompozer.

Message par **chinon37** » 18 nov. 2010, 17:00

Ok, Asumbaa, mais reste un peu dans le secteur, au cas où je dirais des bêtises!...

à fcalmant:
1- KompoZer dispose d'un module css qui permet de créer ses règles de styles de façon très aisée par F11
2- pour appliquer une classe ou un Id à un élément avec KompoZer, tu as 2 possibilités:
+ soit tu vas sur la barre d'outils mise en forme n°1 et tu cliques sur la classe ou l'Id concerné dans le deuxième champ déroulant. A noter qu'un Id ne peut être utilisé qu'une seule fois dans une page.
+ soit tu cliques droit sur l'élément (balise html) dans la barre de taches située tout en bas de l'écran (barre où tu as <html> <body> etc),puis tu mets ta souris sur Id ou Classes et apparaitront toutes les id ou classes créés > tu n'as plus qu'à choisir celui (Id)ou celle (classe) que tu veux appliquer.

Message par **Ymai** » 18 nov. 2010, 23:38

chinon37 a écrit :Ok, Asumbaa, mais reste un peu dans le secteur, au cas où je dirais des bêtises!...

Modestie, quand tu nous tiens...

Message par **chinon37** » 19 nov. 2010, 08:27

<hs> tiens, l'ermite sort de sa (t)caverne!!

</hs>

Je savais bien que j'allais dire une bêtise

fcalmant · Message par **fcalmant** » 19 nov. 2010, 12:54

chinon37 a écrit :Ok, Asumbaa, mais reste un peu dans le secteur, au cas où je dirais des bêtises!...
à fcalmant:
1- KompoZer dispose d'un module css qui permet de créer ses règles de styles de façon très aisée par F11
2- pour appliquer une classe ou un Id à un élément avec KompoZer, tu as 2 possibilités:
+ soit tu vas sur la barre d'outils mise en forme n°1 et tu cliques sur la classe ou l'Id concerné dans le deuxième champ déroulant. A noter qu'un Id ne peut être utilisé qu'une seule fois dans une page.
+ soit tu cliques droit sur l'élément (balise html) dans la barre de taches située tout en bas de l'écran (barre où tu as <html> <body> etc),puis tu mets ta souris sur Id ou Classes et apparaitront toutes les id ou classes créés > tu n'as plus qu'à choisir celui (Id)ou celle (classe) que tu veux appliquer.

Merci!

fcalmant · Message par **fcalmant** » 21 nov. 2010, 00:23

Bonsoir,
J'ai pas mal avancé même si il reste du boulot! J'ai encore un problème; la page s'affiche correctement dans firefox mais c'est le bordel dans IE. Pouvez-vous y regarder svp, ce serait sympa! http://www.exometeofraiture.net/csstest2.php

Merci!!

FF_Olivier · Message par **FF_Olivier** » 21 nov. 2010, 01:09

Bonsoir,

fcalmant a écrit :[....8<...]Pouvez-vous y regarder svp, ce serait sympa! http://www.exometeofraiture.net/csstest2.php

Tu as deux fois les éléments <html>, <head> et <body>, c'est une fois de trop

!

Geckozone

Page css externe

Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Re: Page css externe

Qui est en ligne ?