Toon posts:

[CSS] Div aan onderkant van container div?

Pagina: 1
Acties:

Verwijderd

Topicstarter
Ik ben bezig met de site http://www.webdoeds.nl/~schreuder/index.php?pag=2

Nu heb ik een probleem met het adres / funda nvm logo in de linkerbalk.
Alles werkt in firefox zoals het hoort maar in ie weer eens niet. (zoals jullie kunnen zien)
(Het werkt op de homepage helemaal niet maar dat is ook de bedoeling.)

Het probleem is dat dus bottom: 0px; gewoon niet werkt in internet explorer
Is hier een workaround / oplossing voor of doe ik gewoon iets (heel erg) verkeerd?

Relevante code:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<div class="container" id="container">
  <div class="links">
    <div class="logo">
      [img]"images/logo.jpg"[/img]
    </div>
  <div class="linksmenu" id="linksmenu">
   ...
  </div>
  <div class="linksregeltjeblank"></div>
  ...  
      <br><br><br><br><br><br><br><br><br> <!-- een beetje ruimte voor het adres en fundalogo -->
  <div class="adres">
    <table width="175" border="0" cellspacing="0" cellpadding="5">
      <tr><td style="border-bottom: 1px dashed #022D95">
        <p class="tekst">Verlengde Hereweg 20-2<br>9722 AC Groningen<br>[T] 050 525 20 00<br><a href="mailto:info@schreuder-makelaars.nl">info@schreuder-makelaars.nl</a></p>
      </td></tr>
      <tr><td>
        <nobr>
          <a href="http://www.nvm.nl">[img]"images/nvmlogo.jpg"[/img]</a>
          <a href="http://www.funda.nl">[img]"images/fundalogo.jpg"[/img]</a>
        </nobr>
      </td></tr>
    </table>
  </div>
</div>


code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
div.container{
  position: absolute;
  left: 50%;
  top: 0px;
  width: 750px;
  margin-left: -375px;
  background: url(../images/background.bmp);
}

div.links{
  position: relative;
  width: 175px;
  float: left;
}

div.adres{
  position: absolute;
  width: 175px;
  left: 0px;
  bottom: 30px;
}


Ik ben (bijna) hopeloos, (maar ben er via google al achter dat ik gelukkig niet de enige met dit probleem ben) en ik ben bijna zover dat ik de hele layout naar een table om ga bouwen...

Bij voorbaat dank

  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

Bottom werkt prima in IE, en zo ook in jouw website. Probleem is alleen dat jouw bottom ten opzichte van div.links is, de parent van div.adres. Zet dus een height:100% op je div.links en het zou moeten werken :)

Een tip als je dit soort dingen zichtbaar wil maken:
code:
1
div { border: 2px solid #FF0000; }

[ Voor 21% gewijzigd door André op 07-06-2005 16:38 ]


Verwijderd

Topicstarter
Ik heb nu als tijdelijke oplossing het adres maar gewoon onder het menu geplaatst, maar het is dus de bedoeling dat hij helemaal onderaan de pagina komt. (net boven de 'disclaimer' dus.)

height: 100%; in de parent (links) werkt niet? :S

kijk voor een goed voorbeeld op een lange pagina zoals
http://www.webdoeds.nl/~schreuder/index.php?pag=27

[ Voor 42% gewijzigd door Verwijderd op 07-06-2005 20:01 ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

Verwijderd schreef op dinsdag 07 juni 2005 @ 19:58:
Ik heb nu als tijdelijke oplossing het adres maar gewoon onder het menu geplaatst, maar het is dus de bedoeling dat hij helemaal onderaan de pagina komt. (net boven de 'disclaimer' dus.)

height: 100%; in de parent (links) werkt niet? :S
Hij staat nu tegen de bottom van div.links aan, zorg dan ook dat div.links net zo hoog wordt als je pagina zelf ;)

Verwijderd

Topicstarter
Dat begrijp ik wel :P maar hoe krijg ik de div.links dan net zo hoog als de div.content / hele pagina? (height:100%; helpt/werkt niet?)

  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

En als je die height:100% ook op de div.container zet?

Verwijderd

Topicstarter
Oke ik heb de oplossing inmiddels gevonden: ik heb de div.adres gewoon in de disclaimer gezet met een margin-top van -130px; :D

ps. height: 100%; in de container werkte ook niet omdat de container dan 100% van je scherm word en niet van je pagina... iig bedankt voor je moeite.
Pagina: 1