Notifikationer

Markér alle som læst Log ud

sijmonj Nybegynder

07. december 2007 - 23:44 Der er 17 kommentarer og
1 løsning

fejl med en div box

Hej alle sammen jeg er igang med at lave et design, hvor jeg har en lavet en masse div boxe,

jeg har kaldt et div for "ramme" som så holder på ALT indholdet, og så har jeg sat min indholds box på auto da jeg gerne vil have at hvis der ikke står noget indhold så skal designet bare blive mindre i højden, men når jeg sætter mit div-tag "ramme" til auto også, så forsviner den, altså bliver meget lille og ligger sig aller øverst på designet

så prøvede jeg at give rammen en fast højde på 600px og så kommer den til at se sån her ud

http://img473.imageshack.us/my.php?image=fejllg5.jpg

men nogen som kan se hva fejlen er så jeg kan få sat min ramme på "auto;"?

her er min HTML kode:
----------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ungnewz.dk</title>
<link href="style/style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="ramme">
<div id="logo"></div>

<div id="content">

<div id="v-menu">

<div id="venstre-menu-top">
<div id="venstre-menu-overskrift">Generelt<br />
<br />
<div class="menu_linje"><a href="?page=">Forside</a></div>
<div class="menu_linje"><a href="?page=">forum</a></div>
<div class="menu_linje"><a href="?page=">Spil / Film</a></div>
<div class="menu_linje"><a href="?page=">Anmeldelser</a></div>
<div class="menu_linje"><a href="?page=">Bruger Politik</a></div>

</div>


<div id="venstre-menu-bund">
<div id="venstre-bundmenu-overskrift">News<br />
<br />

<div class="menu_linje"><a href="?page=">Musik / Film</a></div>
<div class="menu_linje"><a href="?page=">I Byen</a></div>
<div class="menu_linje"><a href="?page=">IT</a></div>
<div class="menu_linje"><a href="?page=">Sport</a></div>
<div class="menu_linje"><a href="?page=">Sundhed</a></div>
<div class="menu_linje"><a href="?page=">Andet</a></div>
</div>
</div>

</div>


<div id="indhold">bla bla bla tekst<br />
bla bla bla tekst<br />
bla bla bla tekst<br />
bla bla bla tekst<br />
bla bla bla tekst<br />
bla bla bla tekst<br />
<br />
bla bla bla tekst<br />
<br />
<br />
bla bla bla tekst<br />
<br />
bla bla bla tekst<br />
<br />
bla bla bla tekst<br />
<br />
bla bla bla tekst<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
bla bla bla tekst<br />
<br />
</div>



<div id="hojre-menu-top">
<div id="hojre-menu-overskrift">Login:<br /><br />
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
</div>
</div>


<div id="hojre-menu-bund">
<div id="hojre-bundmenu-overskrift">Anonnce<br /><br />
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
<div class="menu_linje">Menu</div>
</div>
</div>

</div>




<div id="bund"></div>

</div>
</div>
</body>
</html>
--------------SLUT--------------------------

og her er min CSS style kode
---------------------------------------------
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #e0ebf1;
font-size: 12px;
}
#ramme {
height: 600px;
width: 640px;
border: 2px solid #d0dadf;
margin-right: auto;
margin-left: auto;
background-color: #FFFFFF;
}
#logo {
background-image: url(../images/logo.jpg);
background-repeat: no-repeat;
height: 114px;
width: 640px;
margin-top: 23px;
float: left;
}

#content {
width: 630px;
height: auto;
float: left;
margin-top: 20px;
margin-left: 5px;
}

/* VENSTRE MENU START */

#venstre-menu-top {
height: 200px;
width: 102px;
float: left;
margin-left: 5px;
}
#venstre-menu-overskrift {
background-image: url(../images/venstre_menu.jpg);
background-repeat: no-repeat;
height: 20px;
width: 101px;
padding-left: 5px;
float: left;
}

#venstre-menu-bund {
height: 200px;
width: 102px;
margin-top: 210px;
}

#venstre-bundmenu-overskrift {
background-image: url(../images/venstre_menu_bund.jpg);
background-repeat: no-repeat;
height: 21px;
width: 102px;
padding-left: 5px;
float: left;
}

/* VENSTRE MENU SLUT */

#indhold {
height: auto;
width: 370px;
float: left;
margin-left: 15px;
}

/* HØJREMENU START */
#hojre-menu-top {
height: 200px;
width: 102px;
float: right;
}

#hojre-menu-overskrift {
background-image: url(../images/hojre_menu.jpg);
background-repeat: no-repeat;
height: 21px;
width: 102px;
padding-left: 5px;
}

#hojre-menu-bund {
height: 200px;
width: 102px;
float: right;
margin-top: 5px;
}

#hojre-bundmenu-overskrift {
background-image: url(../images/hojre_menu_bund.jpg);
background-repeat: no-repeat;
height: 21px;
width: 102px;
padding-left: 5px;
}
.menu_linje {
height: 15px;
width: 95px;
margin-bottom: 2px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;
}

/* HØJREMENU SLUT */

#bund {
background-image: url(../images/bund.jpg);
background-repeat: no-repeat;
height: 19px;
width: 638px;
float: left;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #747474;
border-right-color: #747474;
border-bottom-color: #747474;
border-left-color: #747474;
}

a:link {
color: #333333;
text-decoration: none

}
a:visited {
color: #333333;
text-decoration: none
}
a:hover {
color: #F68A49;
text-decoration: underline;
}
a:active {
color: #F7894A;
}
---------------------------------------------

og jeg kan overhoevedet ikke finde fejlen :/, håber nogen gider at bruge noget tid på at læse alt min kode igennem, hvis i finder nogen andre fejl må i gerne lige skrive det :)

1000 tak på forhånd, smider mine sidste point ud, hvis i vil have flere for det må i lige sige til så skal jeg prøve at samle nogen sammen,

Synes godt om

zips Juniormester

08. december 2007 - 04:03 #1

Sæt display:table; ind i stedet for din height i ramme
se mere her http://www.456bereastreet.com/archive/200405/equal_height_boxes_with_css/

Synes godt om

sijmonj Nybegynder

08. december 2007 - 16:25 #2

det virkede ikke, den gemmer sig bare bag top logoet :S,

Synes godt om

sijmonj Nybegynder

08. december 2007 - 16:26 #3

forstår det sku ikke, prøvede lige at starte forfra, så skriver jeg <div id ramme og div id logo og div id content og så slutter jeg dem hvor rammen slutter til sidst, og aligevel, selv om rammes height er sat til auto, så gemmer den sig omme bagved logo'et

Synes godt om

zips Juniormester

08. december 2007 - 20:04 #4

Jeg har prøvet med dette, her bliver hele div ramme hvid og er baggrund for alle dine div både i IE 6 og 7 samt i FF
#ramme {
display:table;
width: 640px;
border: 2px solid #d0dadf;
margin-right: auto;
margin-left: auto;
background-color: #FFFFFF;
}
Kan se du nu har sat ramme til height: 719px;

Synes godt om

sijmonj Nybegynder

08. december 2007 - 20:32 #5

"Kan se du nu har sat ramme til height: 719px;"

hvis du tænker på det som er på ungnewz.dk nu, så er det ikke det jeg er igang med, har nemlig lavet lidt nyt på designet og sån, men jeg vil lige prøve det du skrev

Synes godt om

sijmonj Nybegynder

08. december 2007 - 20:36 #6

jeg har lige prøvet at gøre det du skrev, og det virker ikke :/ her er et billed

http://img81.imageshack.us/my.php?image=fejl2my1.jpg

du kan se lige over mit logo, der er rammen , men den gider ikke gå ned :(.

Synes godt om

zips Juniormester

08. december 2007 - 20:46 #7

På det billede du viser er din div for ramme da ikke sidst? siden den stopper rundt om dit logo, er det samme html som ligger her på siden?

Synes godt om

sijmonj Nybegynder

08. december 2007 - 21:45 #8

jah det er samme html som ligger her på siden øverst i indlægget og jo det er lukket min ramme, derfor forstår jeg det slet ikke.

Synes godt om

zips Juniormester

08. december 2007 - 21:56 #9

Ok, her er et link til den test jeg har lavet med display:table;
http://prebendahl.dk/test/images/1.htm

Synes godt om

sijmonj Nybegynder

08. december 2007 - 23:33 #10

mæææærkeligt man !

Synes godt om

sijmonj Nybegynder

08. december 2007 - 23:33 #11

skal jeg lige prøve at uploade hele mit design , og så prøv at sætte det der display:table; på det, så kan du se at det ikke virker

Synes godt om

sijmonj Nybegynder

08. december 2007 - 23:35 #12

nå så fik jeg lige kigget designet i browseren og nu virker det sku :D, det var fordi jeg sad og redigerede det i Dreamweaver, og i dreamweaver der kommer rammen nemlig ikke helt ned, men jeg siger 1000 TAK!! :D fanme fedt du gad at bruge så meget tid på det :)

Synes godt om

zips Juniormester

09. december 2007 - 00:34 #13

Det var så lidt. skønt at kunne hjælpe :-)

Synes godt om

sijmonj Nybegynder

09. december 2007 - 15:20 #14

zips, tror du at du kan hjælpe mig med en lille ting til :)?

det er nemlig mit billed nede i bunden, den er blevet rykket lidt for meget til højre
og jeg kan ikke få den mod venstre :S, du kan prøve at se her

www.ziimx.zeekoo.dk/hjemmesiden

Synes godt om

zips Juniormester

09. december 2007 - 16:13 #15

Sæt dine div som her, så falder den på plads ;-)

</div>
</div>

<div id="bund"></div>

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

Synes godt om

sijmonj Nybegynder

09. december 2007 - 17:59 #16

nice tak man :D, den der kommenter hvor der står "denne er flyttet" hva er det for et div, :D?, og så nu faldt min div ramme også på plads inde i dreamweaver :P, Tak skal du have man :D

Synes godt om

zips Juniormester

09. december 2007 - 18:29 #17

Jeg har gjordt dette


<div id="bund"></div>

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

Synes godt om

sijmonj Nybegynder

09. december 2007 - 18:57 #18

okay, :) tak for dett, nu køre det hele sku :D!

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS