Avatar billede 13thsky Nybegynder
03. april 2005 - 17:43 Der er 3 kommentarer og
1 løsning

spalter under hinanden?

Jeg vil gerne have to tekstspalter under hinanden..
og det som jeg har lavet ser rigtig ud i IE, men i Mozilla FF. ligger tekstfleterne oven i hinanden.
Jeg ved jeg kunne lave en ny style til tekstfelt nr. to og så bare smide en topmargin på, men jeg vil gerne bruge samme style til de to felter.

KODEN:

HTML
------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<title>hhh</title>
<link rel="stylesheet" type="text/css" href="stylesNY2test.css">
</head>

<body bgcolor="#cccccc" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">


<div class="boksmain">

              <div class="2spalter">
                    <div class="spalte2_1">
                        <div class="boks2">
                              <div class="indryk8">
                              aktuelt
                              </div>
                        </div>
                        <div class="indryk8">
                              <div class="overskrift3">
                                  Kaffe er helt iorden - men husk ikke at spare på vandet!
                              </div>
                              <div class="broed1">
                                  Nye undersøgelser viser at kaffe er godt for både hjerte og blodomløb. Det er iorden at drikke et par kopper om dagen, men lad dig ikke narre..
                              </div>
                              <div class="link5">
                                  <a href=#">læs hele historien</a>
                                  <img src="artikkellogo.gif">
                              </div>
                        </div>
                    </div>

              </div>


          <div class="2spalter">
              <div class="spalte2_1">
                    <div class="boks2">
                        <div class="indryk8">
                              dagens spørgsmål
                        </div>
                    </div>
                    <div class="indryk8">
                        <div class="overskrift3">
                              "Hvorfor rumler maven?"
                        </div>
                        <div class="broed1">
                              De fleste af os forbinder maverumlen eller knurren
                              med sult - men faktisk er der flere grunde til at maven gir' lyd
                              fra sig..
                        </div>
                        <div class="link5">
                              <a href=#">læs mere</a>
                              <img src="artikkellogo.gif">
                        </div>
                    </div>
              </div>

          </div>
</div>
</div>
</body>
</html>

CSS
--------------------

DIV.img {
        margin-top: 2px;
        FLOAT: right
}
#allalign {
        BORDER-RIGHT: #666666 1px solid; BORDER-TOP: #666666 1px solid; BACKGROUND: #ffffff; BORDER-LEFT: #666666 1px solid; WIDTH: 784px; BORDER-BOTTOM: #666666 1px solid; HEIGHT: 1110px
}

DIV.boks2 {
        BORDER-TOP-WIDTH: thin; BORDER-RIGHT: #993300 thin inset; FONT-WEIGHT: bold; BORDER-LEFT-WIDTH: thin; FONT-SIZE: 12px; BORDER-LEFT-COLOR: #993300; WIDTH: 230px; COLOR: #ffffff; BORDER-TOP-COLOR: #993300; BORDER-BOTTOM: #993300 thin inset; FONT-FAMILY: Verdana, Tahoma, Arial, Helvetica, sans-serif; HEIGHT: 18px; BACKGROUND-COLOR: #c41039
}
DIV.boks3 {
        BORDER-TOP-WIDTH: thin; BORDER-RIGHT: #993300 thin inset; FONT-WEIGHT: bold; BORDER-LEFT-WIDTH: thin; FONT-SIZE: 12px; BORDER-LEFT-COLOR: #993300; WIDTH: 152px; COLOR: #ffffff; BORDER-TOP-COLOR: #993300; BORDER-BOTTOM: #993300 thin inset; FONT-FAMILY: Verdana, Tahoma, Arial, Helvetica, sans-serif; HEIGHT: 18px; BACKGROUND-COLOR: #c41039
}

DIV.2spalter {
        MARGIN-TOP: 15px;
        WIDTH: 466px;
        HEIGHT: 125px;

}
DIV.spalte2_1 {
        WIDTH: 230px;
        POSITION: absolute;
        HEIGHT: 100%;

}
DIV.spalte2_2 {
        MARGIN-LEFT: 236px;
        WIDTH: 230px;
        POSITION: absolute;
        HEIGHT: 100%;

}

DIV.3spalter {
        WIDTH: 466px;
        HEIGHT: 245px;
        position: absolute;
}
DIV.spalte3_1 {
        WIDTH: 152px; POSITION: absolute; HEIGHT: 245px; position: absolute;
}
DIV.spalte3_2 {
        MARGIN-LEFT: 157px; WIDTH: 152px; POSITION: absolute; HEIGHT: 245px; position: absolute;
}
DIV.spalte3_3 {
        MARGIN-LEFT: 315px; WIDTH: 152px; POSITION: absolute; HEIGHT: 245px; position: absolute;
}
Avatar billede olebole Juniormester
03. april 2005 - 17:54 #1
<ole>

Løsningen, W3C anbefaler i den slags situationer, er at bruge en tabel. Det resulterer altid i skidt kode, når man forsøger at efterligne et element med andre ... og her forsøger du jo netop at efterligne tabellens egenskaber med elementer, der aldrig har været beregnet til det.

Derfor er en tabel, den eneste fornuftige løsning på det, du her skal lave  :)

Husk i øvrigt, at CSS er case-sensitive. Brug små bogstaver overalt - undtagen i klasse-navne og ID'er, hvor der er frit slag.

/mvh
</bole>
Avatar billede 13thsky Nybegynder
03. april 2005 - 23:23 #2
ok, takker...
drop et svar...

/13
Avatar billede olebole Juniormester
03. april 2005 - 23:40 #3
... s'gerne  :)
Avatar billede 13thsky Nybegynder
04. april 2005 - 02:36 #4
there u go

/13
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

Seneste spørgsmål Seneste aktivitet
I dag 10:21 Ny printer, men hvilken Af mort1 i Printere
I går 19:41 USB på Linux Af Uvanga i Linux
12/0818:26 Hvilken type mus Af mort1 i PC
11/0813:21 ms Forms Af leahcim i Andet software
10/0821:30 Blokeret på Snapchat? Af LineP i Chat & Messaging