Design driller

Tjah, det kan så ikke undre mig, at du har fået mange kommentarer om alt muligt andet ...

-- for det første tvinger du Internet Explorer til at skide på de måder, du rent faktisk har beskrevet dit design, så den selv fortolker dine direktiver, og så er det selvfølgelig svært at få det samme resultat i flere browsere (hint: hvis der står _nogetsomhelst_ før doctype går IE i quirks-mode !-)

-- for det andet bruger du så xhtml til at skrive dine sider, og det er der mig bekendt kun ganske få browsere som faktisk kan finde ud af (og så kun, hvis man sørger for, at afslutnings-skråstregen har et mellemrum foran, samt hvis filtypen er fuldstændig korrekt ved afsendelse fra serveren !-)

-- for det tredje bruger du så faktisk teknikker, som hører html 3.2 og tidligere til at opstille dit design med en overdreven anvendelse af tabeller ...

-- og så lige for at komme til sagen: 100% skal have en værdi, den kan tages fra, for 100% betyder jo det hele af ... hvad ?-)

-- ifølge css-standarden skal en relativ størrelse beregnes udfra den definerede størrelse, som det nærmest omkransende elements, som har en defineret størrelse, har, og der findes faktisk ikke en sådan, så det er nær et mirakel, at det rent faktisk ser nogenlunde rimeligt ud ...

1:
Er ikke helt med hvad du mener... altså at <?xml osv skal væk?

2/3:
Hvordan skal jeg undgå de tabeller? :D

Har altid kun arbejdet med tabeller i forbindelse med design-opsætning.

4:
Hvordan skal jeg få defineret en "fast" højde... den er lidt svær i denne situation :D

----------------

Men jeg har hevet en gammel html-version frem af designet... den er dog kun med én menu i venstre, men mere skal vi vel heller ikke bruge :D

Ja, du bruger jo faktisk ikke xml-funktionaliteten (kig også på oles artikler: http://www.eksperten.dk/artikler/index.phtml?users=olebole !-)

Lav det af dit design, som ikke i virkeligheden har noget med tabeller at gøre, som divs, f.eks.

<div id="main" style="margin:0 auto;height:100%;width:760px;">
  <div id="banner" style="height:120px;"><img src="banner"></div>
  <div id="venstre" style="width:120px;float:left">
    <!-- dine venstre-menuer -->
  </div>
  <div id="main" style="width:520px;float:left;">
    <!-- dit hovedindhold -->
  </div>
  <div id="hoejre" style="width:120px;float:left">
    <!-- dine højre-menuer -->
  </div>
</div>

-- måske kan du få ideer ved at kigge på dette spørgsmål: http://www.eksperten.dk/spm/497362 !-)

Sidder og prøver at skrive koden om fra bunden... men hvordan får jeg div'ene til at "stille sig" ved siden af hinanden i stedet for under hinanden... der skal man måske bruge tabel eller?

ahh... undskyld... kiggede ikke lige ordentligt efter i dit eksempel :D

Derfor brugte jeg float:left; !-)

eller ikke helt... hvordan fungerer den der float.. ? kunne en lige komme med en hurtig forklaring :D

Prøv at skrive en lang tekst lige efter:

<img src="etMindreBillede.jpg" style="width:100px;height:75px;float:right;">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque lectus elit, sagittis at, accumsan id, dictum et, erat. Etiam non sapien. Quisque aliquet gravida mi. Integer vitae tortor quis wisi scelerisque vestibulum. Duis pulvinar magna non mauris laoreet volutpat. Aenean et purus. Cras accumsan justo sed arcu. Quisque urna. Sed mi. Ut sed nunc at lorem aliquet vulputate. Proin quis nibh. Proin ut dui vitae urna lacinia posuere. Ut vulputate purus facilisis nunc. Morbi ultrices euismod leo. Integer dui tellus, dictum in, viverra at, sagittis id, sem. Donec nonummy, sem eu hendrerit vulputate, nunc urna molestie eros, et semper nunc mi at ipsum. Praesent tempus malesuada felis.

-- bare test den i et lille browser-vindue !-)

float betyder altså flyd til en side ...

tror jeg er ved at have fattet det nu :D... men hvis jeg skal lave en 3-delt... altså:

<div>
<div id="left"></div>
<div id="middle"></div>
<div id="right"></div>
</div>

Hvis de skal stå ved siden af hianden... hvad så?...

Det er præcis sådan en, jeg har skitseret !-)

-- og når du så skal aflyse float-ningen, altså at de skal i næste linje, skal du bruge f.eks. clear:both;

-- brug også indexdot: http://blooberry.com/indexdot/css/index.html

nårhh... de bliver lagt ovenpå hianden :D... de skal allesammen have left

Nu har jeg rodet lidt med det og fået skrevet det hele om... men i alt andet en Internet Explorer ser det ud som om det hele ligger sig ovenpå hinanden, i lag..

www.advancedweb.dk

Hvad sker der? :D

Hrm, tjah, du er da kommet noget af vejen !-)

-- jeg kan ikke gennemskue dit udsagn om at det ligger oven på hinanden, men i hvert fald 3 ting skal du lige have på plads:

Doctype skal laves, så selv IE overholder standarderne:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

-- og hvis du intenderer at bruge højde til noget skal du så sætte den på både html og body-elementet, og derfor:

html,body {
font-family : verdana,sans-serif;
height:100%;
}

-- jeg fik også lige sat en default font-family på ...

-- og så har du vel et ønske om at centrere sitet:

<body style="background: url(http://www.advancedweb.dk/style/bg.png);">
<div style="width: 750px; height: 100%;margin:0 auto;">

-- du skal også sørge for, at floatingen afbrydes, så indtil flere steder har du brug for:

clear:both; i de styles, som afbryder !-)

Nu har jeg prøvet igen med nogle af de ting du sagde....

Jeg fant også ud af (tror jeg) at hvis man sætte padding på et div-tag altså f.eks

<div style="width: 150px; padding-left: 10px;"> så sætter den paddingen inde i div'en på en sådan måde at diven bliver forlænget... altså at den så bliver 160px... hvis du forstår

ellers kan jeg ikke rigtig fatte hver det er der er galt med  menuen i venstre...

lidt update herfra!! :D

Ja, det er rigtigt at størrelser på elementer skal beregnes inklusive padding, border og margin, så f.eks. en total-bredde på et element ser sådan ud:

margin-left + border-left-width + padding-left + elementbredde + padding-right + border-right-width + margin-right !-)

så skal man så sætte padding i <p> hvis man vil have det til kun at være teksten der skal være rykket...?

Men hvad så med menuen?...