Hvordan unngå frames og tabeller?

[Titanstig]

Nå har jeg vært på ferie en stund, og glemt alt....

 

Jeg skal bygge en fin hjemmeside, med flashbuttons som menyvalg på venstre side.

 

Finnes det noen måte å gjøre dette på uten tabeller eller frames? Jeg skal lage siden fra scratch i HTML og CSS, men jeg er veldig nybegynner. Jeg skriver koden i Dreamweaver, men gjør det bare i "code-view", dvs. manuelt, som i notepad omtrent.

 

Noen som har en oppskrift på å få til meny på venstre siden uten bruk av tabeller eller frames?

 

Noen CSS-eksperter her?

[Cucum(r)]

Oppslagsverk over artikler

[Gjest Slettet+9817234daf]

Noen CSS-eksperter her?

Dem er det plenty av her inne. (jeg er ikke en av dem)

[jorgis]

Hvis du vil unngå å bruke frames, men likevel ha samme funksjonaliteten, er det nok PHP-includes du bør bruke.

[Arve Systad]

http://www.glish.com/css/

 

...og ellers ting på http://www.paradoxia.org/index.php?page=webdev/articles

 

edit: kan jo legge inn et simpelt eksempel sjøl, da

 

<div class="venstre_meny">
<ul>
<li>Menyvalg</li>
<li>Menyvalg</li>
<li>Menyvalg</li>
<li>Menyvalg</li>
<li>Menyvalg</li>
</ul>
</div>

<!-- Slutt meny || Innholdsfelt start -->

<div class="innhold">
<h2>Her kommer innholdet</h2>
<p>Innhold innhold innhold</p>
</div>

 

Og CSSen

 

.venstre_meny {
width: 200px;
float: left;
}

.innhold { 
width: 500px;
float: left;
}

Endret 13. juli 2004 av arve87

[Wizendraw]

@arve87:

Jeg prøvde på det du skrev... (er n00b i html ja )

Det funka jo mye bedre enn tables jo!

Men, så fikk jeg et problem...

http://www.wizendraw.moo.no

Der ser du problemet... I indexen så har innholdet sneket seg inn under der hvor menyen slutter! Og hvis du klikker på Jørgen, så ser du at headeren (ja, vet den suger max, den er bare temp.) har plassert seg helt fu*ka...

 

Jeg innser jo at det bare er noe jeg har gjort feil i koden, men det hadde vært veldig greit å få hjelp til å lokalisere problemet...

 

Jeg kan legge inn koden her om ønskelig, men jeg gidder ikke hvis det ikke trengs...

 

Hmm... posta først i feil tråd...

Fikk dermed tid til å tenke meg litt mer om... og så så jeg jo at begge "float:" var "left;". Så det forklarer seg selv...

 

Men ang. Det andre problemet... Regner med at jeg må ha noe sånt som "float: top;" eller noe?

 

EDIT: oppdaga at alt ikke akkurat løste seg selv om jeg gjorde det jeg gjorde... og float: top; ødela jo bare desto mer...

Endret 13. juli 2004 av WizendraW

[Cucum(r)]

float: top; vil ikke funke.

 

CSS

body {
margin: 0;
padding: 0;
margin-left: 30px;
margin-top: 30px;
font-family: Arial, Helvetica, sans-serif;
font-size: 70%;
}

td { 
border: 1px solid black; border-collapse: collapse; margin: 0; padding: 0;
}

#innhold {
margin-left: 100px;
width: 500px;
background: green;
height: auto;
_height: 300px;
min-height: 300px;
}
#meny {
width: 100px;
float: left;
background: yellow;
clear: both;
height: auto;
_height: 300px;
min-height: 300px;
}
#header {
width: 600px;
height: 200px;
background: #ccc;
}
#header h1 {
display: none;
}

 

<div id="header">
<h1>Sidetittel</h1>
</div>
<div id="meny">
<p>Meny</p>
</div>

<div id="innhold">
<h2>Tittel</h2>
<p>Lipsum her.</p>
</div>

[Wizendraw]

@SirIce:

Takker så meget!

 

Men det er et ar småting jeg ikke helt skjønner i CSSen:

 

Du har

Height: auto;

_Height: 300px;

 

Hvorfor to etter hverandre?

[jorgis]

Det er en liten hack for Internet Explorer for å få til min-height:, noe som IE egentlig ikke støtter.

[Wizendraw]

Det er en liten hack for Internet Explorer for å få til min-height:, noe som IE egentlig ikke støtter.

Aha... Det forklarer saken. Jeg stussa litt over hvorfor den ikke stod som valid css-code i editoren min...

[Arve Systad]

Trur problemet med at teksten sniker seg inn under menyen blir fiksa om du legger teksten i p, og kanskje legger til litt marger

 

Tekst "rett i" div er ikkje "lovlig" - div er ikkje en gyldig tekstcontainer.

[Wizendraw]

Trur problemet med at teksten sniker seg inn under menyen blir fiksa om du legger teksten i p, og kanskje legger til litt marger

 

Tekst "rett i" div er ikkje "lovlig" - div er ikkje en gyldig tekstcontainer.

Aha... seff *fy på meg*

 

EDIT:

Hvis dere ser på sida nå, så er det en liten glippe mellom menyen og lipsum...

Hva var det du sa om marger?

Endret 14. juli 2004 av WizendraW

[Arve Systad]

Trur problemet med at teksten sniker seg inn under menyen blir fiksa om du legger teksten i p, og kanskje legger til litt marger

 

Tekst "rett i" div er ikkje "lovlig" - div er ikkje en gyldig tekstcontainer.

Aha... seff *fy på meg*

 

EDIT:

Hvis dere ser på sida nå, så er det en liten glippe mellom menyen og lipsum...

Hva var det du sa om marger?

marger = margin, avstand fra utsida av et element til neste element.

 

padding = padding: x;, avstand fra innsida av et element til innholdet i elementet.

 

Bruk dei med vett!

[Wizendraw]

Trur problemet med at teksten sniker seg inn under menyen blir fiksa om du legger teksten i p, og kanskje legger til litt marger

 

Tekst "rett i" div er ikkje "lovlig" - div er ikkje en gyldig tekstcontainer.

Aha... seff *fy på meg*

 

EDIT:

Hvis dere ser på sida nå, så er det en liten glippe mellom menyen og lipsum...

Hva var det du sa om marger?

marger = margin, avstand fra utsida av et element til neste element.

 

padding = padding: x;, avstand fra innsida av et element til innholdet i elementet.

 

Bruk dei med vett!

hmm... Men tror du du kan gi meg et litt mer konkret eksempel på hva jeg skal gjøre her?

[Cucum(r)]

Jeg stussa litt over hvorfor den ikke stod som valid css-code i editoren min...

Koden *er* ikke valid CSS2, men den er derimot gyldig i CSS2.1.

[Wizendraw]

Jeg stussa litt over hvorfor den ikke stod som valid css-code i editoren min...

Koden *er* ikke valid CSS2, men den er derimot gyldig i CSS2.1.

Det jeg mente var rett og slett at den hadde en annen farge i TSW WebCoder enn alle de andre CSS-elementene...

[Cucum(r)]

OK, men koden vil likevel gi feil på W3C's CSS validator - da den sjekker stilarket for valid CSS 1/2 kode, og ikke CSS2.1.