3 begynderspørgsmål til lektionerne

Her kan du stille og svare på spørgsmål omkring CSS
Besvar
supermario
Entusiast
Entusiast
Indlæg:32
Tilmeldt:22. feb 2012, 19:28
Geografisk sted:Danmark
Kontakt:
Kontakt supermario
3 begynderspørgsmål til lektionerne

Indlæg af supermario » 22. feb 2012, 19:32

Jeg er ved at lave en navigationsbar, som den i 8. CSS lektion.
Kan dog ikke få den til at passe ind i min DIV selvom mine marginer og padden osv er 0px?

Jeg kan heller ikke få lov til at vælge baggrundsfarve på min nederste DIV?

Mit sidste spørgsmål er til en margin jeg får rundt om min hovedDIV på top, venstre og bund? Den dukker op når jeg besøger min hjemmeside på en mindre browser. Hvordan fjerner jeg den?

Se min side her www.hvoribyen.dk

Håber at her er en haj der gider at hjælpe mig :)

Vh Peter
Top
supermario
Entusiast
Entusiast
Indlæg:32
Tilmeldt:22. feb 2012, 19:28
Geografisk sted:Danmark
Kontakt:
Kontakt supermario

Re: 3 begynderspørgsmål til lektionerne

Indlæg af supermario » 22. feb 2012, 19:34

Mine sider er i øvrigt kodet således:

Kode: Vælg alt

#ulNav {
    list-style-type: none;          /* Så der ikke kommer nogen markører eller dots */
    width: 998px;
}

#liNav{
    float: left;
}

a.nav:link, a.nav:visited {
    display: block;                 /* Så man kan trykke på hele knappen og ikke kun på teksten */
    width: 248px;                   /* Brede på navigationsbaren */
    height: 25px;
    font-weight: bold;              /* Skrifttype Fed */
    font-family: Futura Lt;
    font-size: 16px;
    color: #FFF;
    background-color: #999;
    text-align: center;
    padding: 0px;
    text-decoration: none;          
    text-transform: uppercase;      /* Så alle bogstaver står med stort */
}

a.nav:hover {
    background-color: #ccc;
}


HTML

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <META charset="utf-8" /> <!-- Tekstkoder der anvendes på siden - standard -->
        <META name="keywords" content="I byen, Fest, Natteliv, tilbud" />
        <META name="description" content="På denne side kan du finde inspiration og gode tilbud til byturen" />
        <title>Hvor i byen</title>
        <link rel="stylesheet" href="hib_cssfil.css" type="text/css"/>
        <link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>   <!-- Kan ikke få dette til at virke???-->
        
    </head>
    <body style="background-color: #ffffff">      

            <!-- Hoved div: -->
            <div style="width: 1000px; height: 1025px; margin-left: auto; margin-right: auto; margin-top: 0px; 
                 border-style: solid;
                 border-width: 1px; border-color: #000000;">
                               
            <!-- Topmenu div: -->
            <div style="width: 1000px; height: 25px; margin-left: 0px; margin-right: 0px; margin-top: 0px; 
                        border-style: solid; float: top;
                        border-width: 0px; border-color: #000000; text-align: center; background-color: #f6f6f6"> 
                Top menubar
            </div>

            <!-- Topbillede div: --> 
            <div style="width: 1000px; height: 300px; margin-left: auto; margin-right: auto; margin-top: auto; 
                        border-style: solid; float: top;
                        border-width: 0px; border-color: #000000; text-align: center; background-color: #ffffff"> 
                <img src="overskrift_cocktailglas_1000x300.jpg" alt="Dette er et billede af Hvor i byen overskriften"/>
            </div>
                        
            <!-- Menu under billede div: -->
            <div style="width: 1000px; height: 25px; margin-left: 0px; margin-right: 0px; margin-top: 0px; 
                        border-style: solid; float: top; padding: 0px;
                        border-width: 0px; border-color: #000000; text-align: center; background-color: #fdf2a0"> 
                <ul id="ulNav">
                    <li id="liNav"> <a href="#" class="nav">Home</a></li>
                    <li id="liNav"> <a href="#" class="nav">Om os</a></li>
                    <li id="liNav"> <a href="#" class="nav">Kontakt</a></li>
                    <li id="liNav"> <a href="#" class="nav">Tilbud</a></li>
                </ul>
                
            </div>
            
            <!-- Indhold højresiden: -->
            <div style="width: 230px; height: 600px; margin-left: auto; margin-right: auto; margin-top: auto; 
                        border-style: solid; float: right;
                        border-width: 0px; border-color: #000000; text-align: center; background-color: #f6f6f6"> 
                Indhold højre
            </div>
            
            <!-- Indhold venstresiden: -->
            <div style="width: 770px; height: 600px; margin-left: auto; margin-right: auto; margin-top: auto; 
                        border-style: solid; float: left;
                        border-width: 0px; border-color: #000000; text-align: center; background-color: #ffcbcb"> 
                Indhold venstre
            </div>
            
            <!-- Bundmenu div: -->
            <div style="width: 1000px; height: 75px; margin-left: auto; margin-right: auto; margin-top: auto; 
                        border-style: solid; float: bottom;
                        border-width: 0px; border-color: #000000; text-align: center; background-color: #f6f6f6"> 
                Bundmenu
            </div>
            
            </div>                        

        </body>
</html>
Top
Brugeravatar
ThomasI
Grundlægger
Grundlægger
Indlæg:1528
Tilmeldt:28. dec 2010, 10:49

Re: 3 begynderspørgsmål til lektionerne

Indlæg af ThomasI » 22. feb 2012, 20:16

Hej med dig og velkommen til :D

Jeg tager lige dine spørgsmål i rækkefølge:

1.

Her skal du blot tilføje

Kode: Vælg alt

padding:0px;
til din #ulNav i CSS´en

2.
Din bottom div kan godt have en baggrundsfarve - og det har den! Problemet er at den ligger skjult bag de andre divs for oven. Den ligger altså ikke nederst som du måske kunne tro. flyt din div med din buddiv udenfor din hove div og den vil komme til syne med farve og det hele.

3.
For at fjerne denne margin skriv da

Kode: Vælg alt

style="margin: 0px;"
i dit body tag... Alle sider har som default en margin. Den fjerner du på denne måde...


Til sidst så vil jeg anbefale dig at ændre din doctype så den er : <!DOCTYPE html> . Din side vil derved blive læst som html5. Det vil ikke gøre den store forskel med hensyn til dine nuværende koder
Top
supermario
Entusiast
Entusiast
Indlæg:32
Tilmeldt:22. feb 2012, 19:28
Geografisk sted:Danmark
Kontakt:
Kontakt supermario

Re: 3 begynderspørgsmål til lektionerne

Indlæg af supermario » 22. feb 2012, 20:35

Hej Thomas

Tak for dit hurtige svar :) Det har hjulpet lidt, men desværre ikke helt.

1. Jeg har sat Padding til 0px. Det har fået min navigationsbar helt hen til venstre. Der er dog stadig et mellemrum mellem DIV'en med billedet og navigationsbaren??

2. Jeg har flyttet min bunddiv, og samtidig lavet højden på Hoveddiv'en tilsvarende lavere. Jeg har bare mistet den lækre hovedramme som var hele vejen rundt om mine DIVs. Kan jeg gøre noget andet smart?

3. Min margin er der stadig selvom jeg sætter margin til 0px i min bodytag. Jeg vil gerne have den helt op og ramme toppen af skærmen altså helt uden margin.

(Jeg har opdateret hjemmesiden med rettelserne hvoribyen.dk)

Vh Peter
Top
Brugeravatar
ThomasI
Grundlægger
Grundlægger
Indlæg:1528
Tilmeldt:28. dec 2010, 10:49

Re: 3 begynderspørgsmål til lektionerne

Indlæg af ThomasI » 22. feb 2012, 20:42

Du styler 2 gange i dit body tag...derfor virker det ikke...brug kun style atributten én gang :D

Mellemrummet mellem din nav og billedet skydes sandsynligvis at dine div er større end billedet eller ligende...prøv at rod lidt med det og se om de ændre noget...

Med hensyn til din bud div kan du evt. sætter en højre, venstre og bund kant på ligesom på din hoved div... på den måde vil der stadig være en fint kan som før...

Der skal self ikke være en top kant på bund div´en
Top
supermario
Entusiast
Entusiast
Indlæg:32
Tilmeldt:22. feb 2012, 19:28
Geografisk sted:Danmark
Kontakt:
Kontakt supermario

Re: 3 begynderspørgsmål til lektionerne

Indlæg af supermario » 29. feb 2012, 20:18

Mange tak for hjælpen. Nu er det styr på det :)
Top
Besvar

Tilbage til "CSS"