Avatar billede hooh Nybegynder
27. januar 2005 - 18:44 Der er 4 kommentarer og
1 løsning

css div padding

Hej

jeg har lavet nogle kasser med div, men jeg mellemrum mellem dem.
kasserne er placeret oven på hinanden.

hvordan fjerner jeg det lille mellemrum. Det svarer næsten til cellpadding/cellspacing på tabeller.

fejlen...liggeder mellem "section1" og "section2". "Section1" har lige en pixel for meget(har farvet den rød til at teste)

---- KODE ---
<style type="text/css">
body {text-align: center; margin: 0; padding: 0;}
div.inline {

}
.mainpage {
    border-style: solid;
    width:750;
    border-color: #000000;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 1px;
    border-right-width: 1px;
    padding-bottom:0;
    padding-top:0;
}
P { }

.t_flashheader {
    }
.t_flashheaderfooterLine{
    background:#D4D4D4;
    width:750;
    height:1;
    border-color:C1C1C1;
    border-style: solid;
    border-top-width: 0px;
    border-bottom-width: 2px;
    border-left-width: 0px;
    border-right-width: 0px;
    padding-bottom:0;
    padding-top:0;
}
.sec1_1 {
float:left;
text-align:left;
padding-bottom:0;
padding-top:0;
height:204;
}

.sec1_2 {
    background:#F0F0F0;
    float:left;
    text-align:left;
    width:246;
    height:204;
    border-color:E0E0E0;
    border-style: solid;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-right-width: 2px;
    padding-bottom:0;
    padding-top:0;   
    }
   
.sec1_3 {
    background:#E7E7E7;
    float:right;
    text-align:left;
    width:474;
    height:204;
    border-color:FFFFFF;
    border-style: solid;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 5px;
    border-right-width: 0px;
    padding-right:0;
    margin-bottom:0;
    padding-bottom:0;
    padding-top:0;
    margin:0;
}
.section1 {
width:750;
height:204;
background:red;
}
.section2 {
width:750;
height:10;
background:yellow;
}

</style>
</head>

<body topmargin="0" leftmargin="0" rightmargin="0">

<div class="mainpage">
    <div class="t_flashheader"><img src="images/top_header.jpg" width="750" height="62"></div>
    <table class="t_flashheaderfooterLine" cellpadding="0" cellspacing="0"><tr><td></td></tr></table>
   
    <div class="section1" style="margin:0">   
        <div class="sec1_1">
            <img src="images/left_welcome.jpg">
        </div>
   
        <div class="sec1_2">
                    1_2
        </div>
        <div class="sec1_3">1_3</div>   
    </div>
    <div class="section2">
    <div class="sec2_1"><img src="images/bg_2_1.jpg"></div>
        <div class="sec2_2">1_2</div>
    </div>   
</div><!--mainpage-->
Avatar billede hooh Nybegynder
27. januar 2005 - 19:26 #1
jeg har løst det selv...

har ændret denne kode:

<div class="sec1_1">
  <img src="images/left_welcome.jpg">
</div>

til:

<div class="sec1_1"><img src="images/left_welcome.jpg"></div>


Hvorfor er der forskel på det?? hvordan kan det løses, hvis jeg nu ikke vil ha' det hele til at stå på samme linie
Avatar billede olebole Juniormester
27. januar 2005 - 20:10 #2
<ole>

Det løser du ved at skrive, som alle andre. Det er meget vigtigt altid at lægge lukke-tags helt op i r.... på elementets indhold.
En bedre løsning kunne være, hvis MS løste denne OS-relaterede 'egenskab' (læs: bug) - men det er nok illusorisk  :)

/mvh
</bole>
Avatar billede hooh Nybegynder
28. januar 2005 - 09:21 #3
nu har jeg ikke lige mulighed for at teste det..

men skal man virkelig skrive det hele på en linie?

når du nu siger at lukke tags skal på samme række som elementets indhold, vil det så sige at jeg kan skrive:

<div class="sec1_1">
<img src="images/left_welcome.jpg"></div>

og
<div class="sec1_1">
<img src="images/left_welcome.jpg">
<img src="images/left_welcome.jpg"></div>

osv..??

og hvis du smider et svar så kan du få nogle point
Avatar billede roenving Novice
30. januar 2005 - 14:34 #4
Ja !-)

-- og fejlen optræder kun, når dit indhold er mindre end det ville være, hvis du havde skrevet en tekst inde i !o]

-- i modsætning til den parallelle fejl med </td>er, som i IE altid tilføjer et 'linjeskift', hvis den står på sin egen linje ...
Avatar billede hooh Nybegynder
26. februar 2007 - 22:58 #5
tak til begge

Nu er det godt nok længe siden, men lukker lige sagerne
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
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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