Avatar billede kane Juniormester
26. januar 2007 - 13:22 Der er 7 kommentarer og
1 løsning

nogle fejl i min css, jeg ikke kan fixe

Hej
Jeg roder lidt med en side kun i css (eller det skulle det ende med)

Som I kan se på denne side, så er der nogle ting jeg ikke kan løse og har brug for hjælp.

1. det første mellemrum, der hvor menuen starter, ville jeg meget gerne slippe for.
2.conten delen kan ikke komme helt op i top.
3. conten delen skal følge med helt ned til bunden.

her er min css:

body {
    margin: 0;
    font-size: 100%;
    text-align: left;
    color: #333;
    padding-top: 10px;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    background-color: #606d66;
}


ul { /*fjerner prik fra ul/li*/
    list-style: none;
    margin-left: 0;   
    }

#root {
    text-align:center;       
}

#innerroot {

    width:741px;   
    margin:auto; /*center i firefox*/   
}

div.container {

    margin:0px;
}


div.header {

    background-color: #606d66;
    background-image: url(../gfx/top_pic.gif);
    background-repeat: no-repeat;
    height: 116px; /* Same as h1 line-height */

}

div.maintop {
    background-color: #606d66;
    background-image: url(../gfx/top_main.gif);
    background-repeat: no-repeat;
    height: 61px; /* Same as h1 line-height */
    padding:0;
    margin:0;
}

div.footer {

    background-color: #606d66;
    background-image: url(../gfx/bund_main.gif);
    background-repeat: no-repeat;
    height: 61px; /* Same as h1 line-height */
}

h1.header {
    padding:0;
    margin:0;
}

div.left {
    float:left
    width:155px;
    background-image: url(../gfx/menu_bg.gif);
    background-repeat: repeat-y;
    text-align: left;
   
   
   
}

div.menu a{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    text-decoration: none;
    text-align: left;
    padding-left: 10px;
}


div.content {
    background-color: #FFFFFF;
    margin-left:155px;
    padding-left: 5px;   
   
}


Håber I kan hjælpe mig.
På forhånd tak
Avatar billede kane Juniormester
26. januar 2007 - 13:22 #1
Avatar billede stich Nybegynder
26. januar 2007 - 14:50 #2
1) ul{margin:0;}
3) p{margin-bottom:0;}

2) Er straks værre. For det første kan du tilføje h2{margin-top:0;}, men det hjælper kun lidt. Problemet er at din menu, naturligt nok, er lavet med block-elementer, og de skubber .content (det burde forresten være #content i stedet, altså id i stedet for class) ned. Du *kan* løse det med en negativ top-margin på .content, men det er en elendig måde at gøre det på.
Generelt er din opbygning en smule spøjs, og det er ikke umiddelbart til at løse dette problem på en god måde. Du burde Google på 'two column css', og se på de metoder folk anbefaler. Og så gøre det på en af de måder, jeg tror det kan betale sig i længden.

Desuden har du en del overflødig CSS, fx er der pr. default ikke nogen browsere (som jeg kender til), der smider margin eller padding på div-elementer. Og disse elementer har du en masse overflødige af, fx i menuen; du kan ligeså fint bare style li-elementerne direkte.
Avatar billede kane Juniormester
26. januar 2007 - 15:59 #3
hey
takker for hjælpen, det var nu noget css jeg fandt på w3, så jeg regnede med det var ok :D

1 syntes jeg at jeg havde prøvet.
2. p ?? kan du forklar den?
3. jeg søgte på det du sagde og fandt vist noget jeg kunne bruge. Takker
Avatar billede stich Nybegynder
26. januar 2007 - 16:23 #4
2)Gerne, men hvad? :-)
De fleste browsere smider automatisk både en top- og bund-margin på p-elementer, og den bundmargin gik udover .content-div'en, og skubbede footeren et stykke ned.

En bedre løsning er forresten at smide lidt bund-padding på .content i stedet. Jeg tænkte bare mest i margin-baner, efter jeg havde forsøgt at indsætte *{margin:0;}, og så det hjalp ret kraftigt.

Jeg tror dog generelt du bør kigge lidt mere på CSS, og lære hvad de forskellige ting gør. Det er sjældent en god ide at kopiere kode, som man ikke forstår.

Men velbekomme, og tak for point.
Avatar billede roenving Novice
27. januar 2007 - 01:14 #5
-- skal da lige bemærke, at det er noget vrøvl at sige, at man laver en side i ren css, for det svarer til, at du siger, at du dropper bilen og cyklen og for fremtiden henter morgenbød hos bageren ved at tage autolakken ...

-- css kan style html-elementer, men du er netop afhængig af, at der findes disse html-elementer, som dine styles kan implementeres på ...

-- og blandt disse elementer findes en hulens masse, f.eks. div-, p-, table-, td-, span- og html-tags !-)
Avatar billede kane Juniormester
27. januar 2007 - 08:41 #6
ja, du har ret, og det var en pæn måde at sige det på.

Nu var det uden tabler jeg mente, som du nok havde gættet
Avatar billede kane Juniormester
27. januar 2007 - 10:39 #7
stich

http://vvs-grossisten.com/shopvvs/index.php

Kan du fortælle mig hvorfor mellemrummet på min menu er så stor?
Det er samme css jeg bruger på forsiden (test) og der er ikke så meget mellemrum
Avatar billede kane Juniormester
27. januar 2007 - 11:09 #8
jeg fik den fixet
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester