Avatar billede andersjo Nybegynder
06. juni 2005 - 10:40 Der er 14 kommentarer

Oppdeling av side med <div>

Hei.

Jeg holder på med en web-side som jeg deler opp med <div>. Slik siden er i dag fungerer den fint i IE og Opera 7.54, men ikke i Opera 8 eller firefox 1.0.4.

Side: http://www.bos-ostfold.no/main.php?id=1&vis=hoved
CSS: http://www.bos-ostfold.no/style.css

Siden er delt inn tre vertikale deler; topp, center og bunn.

<div id="topp">
...
</div>

<div id="center">
...
</div>

<div id="bunn">
...
</div>

Den midterste delen (id=center) skal igjen bestå av to spalter. Den venstre skal inneholde en meny og den høyre skal inneholde den info som vises på siden.

<div id="center">
  <div id="meny">
  ...
  </div>

  <div id="hoved
  ...
  </div>
</div>

Problemet er at innholdet i <div id=center> legger seg over resten av siden nedover og ikke inne i div-boxen.


Hele koden:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Bertel O. Steen Østfold AS</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body class="background">

<div id="top">
<?php
include ("topp.php");
?>
</div>


<div id="center">

    <div id="meny">
    <table border="0" width="100%" cellpadding="0" cellspacing="0">

        <tr><td>
            <table width="100%" border="0" cellpadding="2" cellspacing="0">
            <tr><td class="liten_overskrift"><?=$sted?></td></tr>
            <tr><td><hr noshade size="1" color="#676767"></td></tr>
            <tr><td class="meny">
            <img src="Bilder/pil.gif" border="0"> <a href="main.php?vis=hoved">Om oss</a><br>
            <img src="Bilder/pil.gif" border="0"> <a href="main.php?vis=brukt">Brukte biler</a><br>
            <img src="Bilder/pil.gif" border="0"> <a href="main.php?vis=mb">Ny Mercedes-Benz</a><br>
            <img src="Bilder/pil.gif" border="0"> <a href="main.php?vis=peu">Ny Peugeot</a><br>
            </td></tr>
            </table>
        </td></tr>

        <tr><td height="10"></td></tr>

        <tr><td><img src="Bilder/slr-marg.jpg" border="0" alt=""></td></tr>

    </table>
    </div>
   
   
    <div id="hoved">
    <?

    if ($vis=="hoved")
    {
        include ("hoved.php");
    }
    else if ($vis=="brukt")
    {
        echo ("<iframe src=" .$brukt. " frameborder=0 width=100% height=100% scrolling=yes></iframe>");
    }
    else if ($vis=="mb")
    {
        include ("mb.php");
    }
    else if ($vis=="peu")
    {
        include ("peu.php");
    }
    else if ($vis=="visbil")
    {
        include ("visbil.php");
    }
    ?>
    </div>
</div>

<div id="bunn">
<?php
include ("bunn.php");
?>
</div>

</body>
</html>


Håper noen kan hjelp meg med å finne ut av hva som er feil, enten det er html-koden eller CSS-koden som er feil.

//andersjo
Avatar billede flash_geek Nybegynder
06. juni 2005 - 12:00 #1
Bare en idé prøv at sætte en heigth det har jeg tit bemærket at mozilla ikke bryder sig om når den mangler. Men du kan bare ikke sætte den til auto for det virker som regelt ikke.

Ellers prøv at se denne side for mere hjælp: http://www.alistapart.com der er der mange gange en forklaring.

Iøvrigt hvorfor om konvertere du ikke til (x)html ;-)
Avatar billede flash_geek Nybegynder
06. juni 2005 - 12:02 #2
Jeg mener height *g*
Avatar billede andersjo Nybegynder
06. juni 2005 - 13:08 #3
Jeg har tidligere satt en height i #center ja, men jeg ønsker at siden skal endre høyden dynamisk etter innholdet i div-boxen.

Mulig xhtml er bra, men det har jeg aldri benyttet. Hadde derfor vært greit å slippe det...

//andersjo
Avatar billede andersjo Nybegynder
06. juni 2005 - 13:46 #4
På hvilken måte ville xhtml gjort dette enklere eller bedre?

//andersjo
Avatar billede flash_geek Nybegynder
06. juni 2005 - 15:05 #5
(x)html standard complient som html dog mere strict. Accessability er blevet bedre. Kode og layout præsentation er adskildt. Men det er det også på den måde du gør. Så du får nok ikke løst dit problem ved at benytte (x)html.

Du har stortset lavet en (x)html struktur så jeg synes bare det var mærkeligt du ikke gik hele vejen og benyttede de nye standarder.

-- Ja jeg forstår godt din frustration mht height og desværre virker det nok ikke at sætte højden til auto.

Prøvede du linket jeg gav dig ? Der mange løsninger og browser hacks.
Avatar billede olebole Juniormester
06. juni 2005 - 15:08 #6
<ole>

Om du skriver HTML eller XHTML, gør absolut ingen forskel i din forhold til dit aktuelle problem ... bortset fra at XHTML stort set er ubrugeligt idag og derfor blot gør din kode mere besværlig at arbejde med for brugerens browser.

Folk, der anbefaler XHTML, har yderst sjældent selv skrevet en eneste XHTML-side, der har virket som sådan. Af alle de XHTML-sider, der findes på WWW idag, er det under et par procent, der parses som andet end fejlfyldt HTML.

www.alistapart.com er f.eks. et glimrende eksempel på et site, der validerer fint, men som sætter enhver browser på overarbejde, fordi den, der har kodet skidtet, ikke kan sit fag. Sitet parses som fjlfyldt HTML4 i alle browsere på nettet.
Koden ville have været langt bedre, hvis den var skrevet i HTML4.01 - men ville tilgengæld så ikke give anledning til så samme 'religiøse' begejstring  :)

Læs evt:
    http://www.eksperten.dk/artikler/537
    http://www.eksperten.dk/artikler/538
- og bliv klogere på XHTML.

I (X)HTML er der kun ét element, der er beregnet til at man kan have to rækker med fast højde - og med en dynamisk række imellem ... det er tabellen. Derfor er du enten nødt til at bruge en tabel - eller en løsning i JavaScript. I det felt er tabellen langt at foretrække  :)

/mvh
</bole>
Avatar billede olebole Juniormester
06. juni 2005 - 15:12 #7
flash-geek >> Hvad mener du med, at spørgeren har brugt en '(x)html struktur'? Der er da intet XHTML over den kode.

Hvis du tror XHTML er bedre adskilt i kode og layout, er det fordi, du ikke kender XHTML - og/eller HTML. Det er absolut ikke tilfældet.
Avatar billede flash_geek Nybegynder
06. juni 2005 - 15:28 #8
Jeg mener bare at html dokumentet er struktureret på stort set samme måde det mangler bare en anden header:

<!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">

Selvfølgelig er alle tags ikke lukkede men det ville ta mig 1 min eller 2 at lave hans side om til (x)html.

Men jeg mener blot at han holder præsentation og kode adskildt på samme måde. Så det er nemt at om konvertere.

Bole du vrøvler når du skriver at (x)html er ubrugeligt. Det bliver anvendt af flere og flere.

Men lad os blive ening om at (x)html ikke løser dette problem så lad os glemme denne diskution.
Avatar billede flash_geek Nybegynder
06. juni 2005 - 15:40 #9
Et godt eksempel på en stor side som benytter (x)html er www.blogger.com og her en side der bare holder en andet eksempel er http://www.w3schools.com/ ;0P
Avatar billede olebole Juniormester
06. juni 2005 - 15:55 #10
www.blogger.com serves som ren HTML og tolkes derfor som HTML og ikke XHTML ... præcis det samme gælder www.w3schools.com  :)

Adskillelsen af markup, visuel formatering og funktion er noget XHTML har arvet efter HTML4.01-Strict. Hverken XHTML1.0 eller 1.1 er synderligt mere stringente på det punkt.
At huske at lukke tags er det aller mindste af det at skrive XHTML. Det er langt fra nok, at dit dokument validerer.

Problemet er, du ikke ved, hvordan XHTML skal bruges - og at det overhovedet ikke interesserer dig. Havde det gjort det, havde du formodentlig læst de to artikler og blevet klogere.
Derfor ville det da også være meget dumt af dig bare at 'glemme denne diskution'. Så finder du jo aldrig ud af, hvordan man koder  :)

Hvis du er uenig, kan du jo blot argumentere. Læs artiklerne og fortæl, præcist hvad jeg tager fejl i. Hvis der er substans i dine påstande, skal jeg nok lade det flyde videre til W3C.
Hvis du i dine 'studier' blot var nået så langt som til at læse W3C's FAQ om XHTML, ville du nemlig vide, jeg ikke skriver andet, end de gør. Desværre er der bare yderst få fundamentalistske XHTML-tilbedere, der nogensinde har gjort sig den ulejlighed at læse, hvad W3C selv skriver om emnet  ;o)
Avatar billede olebole Juniormester
06. juni 2005 - 16:02 #11
Når man validerer, er det vigtigt, man gør det rigtigt. Det er f.eks. vigtigt at vide, hvordan et dokument bliver sendt fra serveren, hvorfor man bør bruge validatorens extended interface:
  http://validator.w3.org/check?uri=http%3A%2F%2Fwww.w3schools.com%2F&charset=%28detect+automatically%29&doctype=Inline&verbose=1

Læg mærke til, at dokumentet bliver sendt med MIME-typen 'text/html' - hvorfor det bør stå¨tydeligt for enhver, der blot ved det første om XHTML, at dette dokument umuligt kan parses som andet end HTML.

Da der derfor er brugt forkert DTD og alle tags uden native-lukketag har XHTML-lukning, skal alt dette først repareres, før browserens HTML-parser kan behandle dokumentet ... de nævnte ting er jo som bekendt ikke valid HTML.
Avatar billede flash_geek Nybegynder
06. juni 2005 - 18:16 #12
Så så ro på Ole du pisker en stemning op. Du ved en hel masse om emnet så meget ved jeg slet ikke. Men nu kom jeg ikke ind på hvordan dokumentet bliver sendt fra severen og brugen af MIME-typen text/html og ikke MIME-typen text/xml er for at sikre sig at gamle forældede browsere opfatter koden som html. Men når gamle browsere forsvinder så kan det også være at html forsvinder. Hvis alle browser producenter kan blive eninge.

Det eneste jeg kan sige er jeg er selv godt tilfeds med (x)html. Jeg har ikke oplevet en browser der ikke har kunne læse min kode.

Nu skal du heler ikke tro jeg har en masse imod html. Men jeg har bare længe haft den opfattelse at (x)html er fremtiden. Det skal bare implementeres ordenligt på sigt og de problemer du nævner skal vel egentlig bare løses.

Samtidig vil jeg lige nævne at jeg ikke mener man skal droppe brugen af <table> <p> <li> osv. og give sin xhtml ren div'itis. Men jeg håber bare at dagene med grimme kompliserede tabel strukturer er ved at være forbi.

Det kan da også være at jeg har taget fejl og blevet lokket af (x)html tilbedere. Så jeg vil da lige kigge på FAQ siden. Jeg er ikke tilbageholdene overfor nye ting. Og hvis jeg finder ud af at xhtml er noget skidt så bruger jeg det ikke mere. Fordi html strict kan stort set det samme. I det hele taget kan jeg bare godt lide ideen med at holde markup kode og præsentation adskildt (og der synes du vel også godt om Ole).

Til sidst vil jeg lige sige at jeg ikke føler mig klædt på til at tage diskutionen fuldt ud. Men der er nok andre der kan forklare dig et par ting måske. Det kan også være du har ret. Men vi må nok se hvad W3C finder ud af...
Avatar billede flash_geek Nybegynder
06. juni 2005 - 21:11 #13
Nu har jeg læst dine artikler -- det må jeg gi' dig du har sat dig godt ind i tingene. Og jeg er ret ening i det du skriver. Så der lærte jeg noget. Den sidste artikel fastslår at xhtml er spild af tid indtil xhtml2.0 er klar. Det er noget man kan nørde med på sine egne sider men ikke på kunders sider.

Jamen så er det vel bare at benytte html4.01 strict. Så er man næsten klar til når xhtml2.0 er standard. Frem over vil jeg bruge mere tid på at læse hvad W3C skriver.

Så siger jeg tak for din visdom Ole ;o)
Avatar billede olebole Juniormester
07. juni 2005 - 02:45 #14
Selvtak. Tro mig ... jeg forstår til fulde, hvorfor du troede, XHTML er kanon godt. Hvordan skulle man få anden opfattelse, når man læser om emnet rundt om på nettet?

Jeg er godt klar over, jeg kan være 'lidt' (*host-host*) anmassende på dette punkt, men det glæder mig, du fik noget ud af det  :)
Ikke alene synes jeg, det er unødvendigt at skrive til en standard, der fungerer dårligere - men det ærger mig især, at så mange bliver vildledt i så mange tutorials og artikler på nettet. Det gælder ikke kun for XHTML ... du nævner selv tabel-hysteriet, som du heldigvis ikke er hoppet på.
Derfor er det mig magtpåliggende at forsøge at få folk til at gå direkte til kilden. W3C er kilden. Alt andet er fortolkninger - med alt, hvad det nu fører med sig. Forleden var der i et andet spørgsmål et link til w3cschools.com ... vi endte op i fem-seks fejl på siden. Ikke kodefejl, men faktuelle tekstfejl!
Jeg er såmænd heller ikke i tvivl om, der nok skal komme en og prikke mig på skulderen og påvise en fejl i mine en dag - men forhåbentlig ikke så mange  ;o)

andersjo >> Undskyld, vi fik spammet dit spørgsmål  :)
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