Avatar billede ziron Nybegynder
17. juni 2008 - 23:11 Der er 5 kommentarer

Placering af div (bottom)

Hej exp'er.

Jeg sidder med siden, http://www.com8.dk/exp/

Hvor jeg gerne vil have den røde boks, et billede som ligger i en div, til at ligge nederst i den grønne boks.

Om det smartes at gøre det med div og position, kan jeg ikke helt finde ud af, det vil nemlig ikke virke på nogen måde.

Hjælp mig lige på rette spor igen, takker.

Koden er som følger:

<table cellpadding="0" cellspacing="0" border="0" width="780">
  <tr valign="top" align="left">
  <td style="background-image: url('left_repeat.png'); background-repeat: repeat-y;"  width="214" height="100%">
    <div style="height: 100%;">
    <div style="background-image: url('left_down.png'); height: 134;"></div>
    <div style="background-image: url('left_up.png'); height: 290;"></div>
      </div>
  </td>
  <td>
      a<br />
    b<br />
      c<br />
      d<br />
      e<br />
  </td>
  <td width="92" style="background-image: url('right_repeat.png'); background-repeat: repeat-y;"> 
  </td>
  </tr>
</table>
Avatar billede stenger Nybegynder
18. juni 2008 - 08:34 #1
Kan du ikke sætte background-position:left bottom; på (kan ikke huske om det er bottom left; eller left bottom;)?
Avatar billede ziron Nybegynder
18. juni 2008 - 10:40 #2
Jo men, så vil den placere sig inden for div'en, men det selve div'en jeg skal flytte?
Avatar billede w13 Novice
18. juni 2008 - 10:41 #3
Kan du ikke bruge noget position:absolute;bottom:0; ?
Avatar billede ziron Nybegynder
18. juni 2008 - 11:55 #4
Jeg har prøvet, kan dog bare ikke få det til at virke, ville mene det kunne lade sig gøre?
Avatar billede roenving Novice
18. juni 2008 - 13:28 #5
Tjah, tjoh, f.eks. sådan, implementerer du det direkte kan du også få øje på problemerne:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>En titel (obligatorisk)</title>
<style type="text/css">
  *{margin:0;padding:0;}
  html, body{height:100%;}
  .minTabel{border:0;border-collapse:collapse;width:780px;height:100%;/*position:relative;*/}
  .minTabel td{margin:0;border:0;}
</style>
</head>
<body>
      <table class="minTabel">
  <tr valign="top" align="left">
  <td style="background-image: url('http://www.com8.dk/exp/left_repeat.png'); background-repeat: repeat-y;width:214px;height:100%">
    <div style="height: 100%;position:relative;">
    <div style="background-image: url('http://www.com8.dk/exp/left_down.png');width:100%; height: 134px; position:absolute; bottom:0;">&nbsp;</div>
    <div style="background-image: url('http://www.com8.dk/exp/left_up.png'); height: 290px;">&nbsp;</div>
      </div>
  </td>
  <td>
    a<br>
    b<br>
...
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