Plassere bilde i CSS tabell

[Hypernicus]

Hvordan legger jeg et bilde til høyre for menyen inni en tabell.

 

Menyen er enkel tekst, ikke noe fiks faks, og bildet ligger rett til høyre for dette.

[Lovskogen]

Har du kodesnutten? Er ganske sikker på at menyen din ikke skal ligge i en tabell.

[Hypernicus]

Hvordan plasserer jeg et bilde blant tekst da? Bruker jeg z-index til alle slike formål? Der hvor jeg leser står det at man plasserer bildet bak og foran tekst med z-index.

[Lovskogen]

Et bilde blant tekst bruker du img-taggen til. Men, har du ingen kodesnutt å vise?

[Hypernicus]

Se vedlagt fil. Dette er ikke CSS fila, men layouten skal være noe lunde likt.

index.html

[Lovskogen]

Hepp, du må kode opp siden din med divisjoner isteden for tabeller. Og menyen din må du kode opp som en liste, med <ul> og <li>-elementer.

Endret 24. juli 2006 av George Bush

[834HF42F242]

Her er grunnprinsippet om flytende elementer!

 

I markup:

 

<p><img src="./bilde.png" class="abilde" alt="Et bilde"/>Dette er tekst som plasseres innengor et paragraf-element. Du kan også putte et bilde innenfor paragrafen for å holde det jamnt med teksten. Div blir brukt for å holde teksten på plass, gjerne for det er ønsket at denne skal flyte ved siden av noe annet igjen. Dette eksempelet er forenklet, med kun "p" og "img".</p>

 

I CSS:

 

.abilde {
    float: left;
}

 

Eksempel for ditt tilfelle:

 

<div class="menylinje"><ul><li>Menvalg 1</li>
<li>Menvalg 1</li>
<li>Menvalg 1</li>
<li>Menvalg 1</li></ul>
<img src="./bilde.png" class="abilde" alt="Et bilde"/></div>

.menylinje ul {
  float: left;
  padding: 0;
  margin: 0;
  list-style: none;
}

.menylinje li {
   float: left;
   padding: 2px;
}

.abilde {
   float: left;
}

Endret 27. juli 2006 av neitakk