CSS vil ikke virke

Josefine · Indlæg af **Josefine** » 4. maj 2012, 18:22

Hej (igen igen), NemProgrammering!

Jeg er stødt på et lille begynderproblem igenigen: mit CSS vil ikke virke. Jeg er ved at følge den 10. HTML guide herinde (den med div tags), men når jeg ser på min css-side i min browser, så viser den kun CSS-koderne, dvs. koderne er ligesom ikke "aktiveret", hvis I forstår.

Er der nogen, der ved, hvad dette problem kan skyldes?

Mine PHP- og HTML-filer virker fint. Jeg (tror) ikke, jeg bruger XAMPP eller noget. cristian herinde hjalp mig med at aktivere noget PHP via min terminal, og nu ligger mine HTML- og PHP-filer inde i denne gruppering: Macintosh HD -> Bibliotek -> WebServer -> Documents -> NetBeansProject -> NetBeansProject -> og så inde i en af de mapper, jeg har oprettet her efterfølgende. Hvis det er en HTML fil, har jeg selvfølgelig lagt den i den HTML-mappe, jeg har oprettet herinde.
Når jeg kører dem i browseren virker de helt fint (jeg kan dog ikke få NetBeans til at åbne dem ved at trykke "run" af en eller anden grund, men er i stedet nødt til at gå ind i min browser og trykke "åbn arkiv..." og åbne den derfra).
Jeg har en tilsvarende CSS-mappe, og herinde ligger mine CSS-filer så selvfølgelig, ligesom PHP- og HTML-filerne ligger i deres mapper.
Men mit CSS gider altså ikke aktiveres!

Er der nogen, der har nogle ideer til, hvad jeg har gjort galt

Indlæg af **ThomasI** » 5. maj 2012, 10:35

1.

CSS filer skal ikke køres som html og php sider. Når du ser en css fil i en browser så er det helt normalt at koderne bare står der. En CSS fil skal jo ikke ses på af nogen andre, den skal blot bruges af en html side, så den skal sådanset bare være der uden at skulle vises i en browser. Der er jo ikke noget indhold på din CSS fil andet end koderne...

2.

I netbeans skal du trykke "view" istedet for "run" når du vil se en html fil.

Josefine · Indlæg af **Josefine** » 5. maj 2012, 13:29

Åh, nå okay.... men hvordan skal koderne så virke? Skal man linke til css-siden i ens html-side eller...? I videoen ser det nemlig ud, som om der er lavet et link hen til siden - jeg har dog prøvet med det samme link, men det virker ikke helt.
Så hvordan skal jeg kunne få vist det CSS-layout, jeg laver?

Indlæg af **Daniel** » 6. maj 2012, 00:03

Hej Josefine.

Du har fat i den helt rigtige ende, du skal indsætte et link i din HTML fil til din CSS fil for at koderne kommer til at virke.

Et sådan link skal placeres imellem dine

Kode: Vælg alt

<head></head>

tag, og skal se sådan ud:

Kode: Vælg alt

<link rel="stylesheet" href="Placering på din cssfil" type="text/css"/>

Et eksempel på hvordan den kunne se ud:

Kode: Vælg alt

<head><link rel="stylesheet" href="style.css" type="text/css"/></head>

Den ovenstående kode linker til en css fil som hedder style og som ligger i samme mappe som din html fil, hvis den ligger i en anden mappe skal du huske at tilføje den mappe i din placering også.

Josefine · Indlæg af **Josefine** » 6. maj 2012, 10:20

Mange tak for jeres hjælp endnu engang, men problemet er bare, at det heller ikke virker. Hele min kode i html-delen ser nu sådan ud:

Kode: Vælg alt

<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title>Dette er en testside</title>
        <META charset="utf-8" />
        <META name="keywords" content="Test" />
        <META name="description" content="Her tester jeg noget HTML" />
        <a rel="stylesheet" href="file:///Library/WebServer/Documents/NetBeansProjects/NetBeansProjects/CSS%20projekter/CSS%20styling.css" type="text/css"/>
        </head>
    <body>
        
        
        <h2>Josefines div-tags</h2><br/> <br/><br/>
        
       
    
        <!-- Hoved div: -->
        <div id="hoved">
        
        
        <!-- Top div: -->
        
        
        <!-- Menu div: -->
        
        
        <!-- Indhold div: -->
        
        
        </div>
        
        
    </body>
</html>

Linket til css-siden er så lang, fordi jeg ikke rigtig kunne få det til at fungere med et kortere link? Jeg har prøvet bare at skrive /CSS%20projekter/CSS%20styling.css, men det virker desværre ikke? Men det er også lidt ligemeget, linket til den skulle i hvert fald virke nu.

CSS-sidens kode, som jeg har linket til, ser således ud:

Kode: Vælg alt

#hoved {
    width: 700px;
    height: 1000px;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: thin;
    
    
    
    
}

Men når jeg ser min html-side i browseren, så er det eneste, der kommer frem, en h2-overskrift med teksten "Josefines div-tags", og denne tekst er i stedet for blevet lavet om til et link, der, når man trykker på det, viser min side med CSS-stylingen - hvilket vil sige, kun CSS-koderne, for den henviser bare hen til selve CSS-siden.

Hmmm

Indlæg af **Daniel** » 6. maj 2012, 11:28

Det var ellers noget af et link, men så vidt jeg kan se er det ikke noget gyldigt link, hvis du kunne prøve at smide din css fil ind i samme mappe som din HTML sådan du bare skal skrive filnavn.css og se om det virker, hvis det virker så har det højst sandsynligt noget med dit link at gøre (skal lige siges det ikke altid er helt nemt at finde rundt i de links selv for garvede programmøre).
Hvis det ikke virker så er det højst sandsynligt slet ikke i dine dokumenter fejlen ligger, men det kan vi se på bagefter hvis det ikke virker.

Josefine · Indlæg af **Josefine** » 6. maj 2012, 11:56

Jeg har nu prøvet at smide min CSS-fil ind i den samme mappe, som HTLM-filerne ligger i, men linket virker blot på samme måde som det forrige link, jeg satte ind.

Indlæg af **ThomasI** » 6. maj 2012, 12:01

1 . Omdøb din css fil til CSS_styling.css

2 . Placer den i samme mappe som din html fil

3 indsæt dette i dit link tag : href="CSS_styling.css"

Så skulle det meget gerne virke... du kan så efterfølgende prøve at flytte rundt på din css fil og se om du kan få det til at virke når den ligger i andre mapper...

Josefine · Indlæg af **Josefine** » 6. maj 2012, 12:02

Og jeg har også prøvet at navngive den CSSstyling (altså uden mellemrum), men det giver desværre samme resultat. Jeg ved ikke lige, hvad der går galt

Jeg må simpelthen have en tendens til at tiltrække mystiske problemer, der absolut kræver dybere undersøgelser

Josefine · Indlæg af **Josefine** » 6. maj 2012, 12:04

ThomasI skrev:1 . Omdøb din css fil til CSS_styling.css

2 . Placer den i samme mappe som din html fil

3 indsæt dette i dit link tag : href="CSS_styling.css"

Så skulle det meget gerne virke... du kan så efterfølgende prøve at flytte rundt på din css fil og se om du kan få det til at virke når den ligger i andre mapper...

Jeg har lige prøvet det (dog uden underscore), sjovt som du lige har skrevet det - men med samme resultat.

Indlæg af **ThomasI** » 6. maj 2012, 12:07

Du får ikke en firkant på din side som viser denne hoved div?

Din css fil ender på css ikke?

Josefine · Indlæg af **Josefine** » 6. maj 2012, 12:15

Nej, jeg får min h2-overskrift med "Josefines div-tags", som linket så på en eller anden måde er gået ned i, og når jeg trykker på den tekst, så kommer jeg hen til min CSS-side, hvor mine CSS-koder er.
Jeg får altså intet resultat af mine CSS-koder.

Sletter jeg min overskrift, får jeg bare en blank side.

Mit link ser nu således ud:

Kode: Vælg alt

 <a rel="stylesheet" href="CSSstyling.css" type="text/css"/>

Og min CSS-fil ligger nu i samme mappe som mine HTML-filer (der ellers virker fint).

Indlæg af **Daniel** » 6. maj 2012, 12:19

Du har husket at gemme din CSS fil som .css og ikke .html?

Josefine · Indlæg af **Josefine** » 6. maj 2012, 12:24

Jeg ville ønske, det var det, der var problemet, men det er det desværre ikke:

Josefine · Indlæg af **Josefine** » 6. maj 2012, 12:25

- Og den HTML-fil, jeg har koderne og linket til CSS-filen i, er den, der hedder "Test.html"

Indlæg af **ThomasI** » 6. maj 2012, 13:43

STOP!!!

Der er en stor fejl i det du laver

Hvis du nu kigger på det som Daniel skriver så skriver han:

Kode: Vælg alt

<link rel="stylesheet" href="CSSstyling.css" type="text/css"/>

IKKE:

Kode: Vælg alt

<a rel="stylesheet" href="CSSstyling.css" type="text/css"/>

Du skriver det ind som et almindeligt link, og det skal det IKKE... Så er det klart at du får et link på din side og ikke en styling fra dit sheet...

Det skal altså se sådan her ud:

Kode: Vælg alt

<head>
        <title>Dette er en testside</title>
        <META charset="utf-8" />
        <META name="keywords" content="Test" />
        <META name="description" content="Her tester jeg noget HTML" />
        <link rel="stylesheet" href="CSSstyling.css" type="text/css"/>
        </head>

Man linker altså ikke på samme måde til en css fil som man gør med almindelige links!

Indlæg af **ThomasI** » 6. maj 2012, 13:45

Læs mere her:

http://www.w3.org/TR/html4/present/styles.html

CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Re: CSS vil ikke virke

Office

CMS

Webudvikling

Udvikling

Adobe

Andet

Online Markedsføring

App- og spiludvikling