[CSS] Valign = bottom met een DIV - Softwareontwikkeling

dinsdag 29 augustus 2006 00:21

Acties:

Topicstarter

Zie afbeelding;
Rechtsboven is een div en de rest is een div.
Ik wil dus dat die div rechtsboven onderaan begint zodat ik hier een image kan inplaatsen zodat die niet wordt overschreven met text.
Ik heb alles geprobeerd wat ik maar kon vinden op google, iemand enig idee?

code:

#right { 
float: right; 
width: 250px; 
}

#left{
}

Afbeeldingslocatie: http://img79.imageshack.us/img79/7383/gotnt4.th.jpg

[ Voor 16% gewijzigd door no11 op 29-08-2006 00:22 ]

dinsdag 29 augustus 2006 13:10

Acties:

no11

Topicstarter

Margin-top heeft ook geen zin want dan komt boven de div (afstand van margin) geen tekst te staan van de andere div..

Kan ik die linker div niet een speciale vorm geven oid?

dinsdag 29 augustus 2006 14:34

Acties:

iworx

code:

1 2	body { position: absolute; } #right { position: relative; bottom: 0; right: 0; width: 250px height: 250px; }

en anders via javascript.

This space intentionally left blank.

dinsdag 29 augustus 2006 14:38

Acties:

Verwijderd

Yep, dan krijg je dus zoiets als hieronder. Alleen zal de inhoud van de <p> niet om het plaatje heen lopen...

HTML:

<html>
<head>
    <style type="text/css" media="screen">
    #wrapper {
        width: 500px;
    }
    #floating {
        background:#EAEAEA;
        position:relative;
        _height: 100%; /* IE hackje */
    }
    #floating img {
        position:absolute;
        bottom:0;
        right: 0;
    }
    </style>
</head>
<body>

<div id="wrapper">
    <div id="floating">
        <p>
            asdg asdg asgdasg sdga sadg sad gsadgkl;sadg sdgakljasdg lasdkgjasdg asdglkjasdg sdgalkj
            <img src="test.jpg" height="100" width="100" alt="" />
        </p>
    </div>
</div>

</body>
</html>

dinsdag 29 augustus 2006 16:04

Acties:

no11

Topicstarter

Sorry maar ik kom niet echt verder met dat van jullie..
Weet iemand hoe dat heet in javascript? Dan moet het maar in javascript verder ook geen probleem!

[ Voor 7% gewijzigd door no11 op 29-08-2006 16:04 ]

dinsdag 29 augustus 2006 16:25

Acties:

iworx

no11 schreef op dinsdag 29 augustus 2006 @ 16:04:
Sorry maar ik kom niet echt verder met dat van jullie..
Weet iemand hoe dat heet in javascript? Dan moet het maar in javascript verder ook geen probleem!

Ik denk dat je echt beter eens een boek vastneemt. Bovenstaande oplossingen doen het echt wel. Ofwel is je vraag niet duidelijk, ofwel heb je ergens fouten zitten.

CSS is een debug nightmare met momenten, maar dit is dead easy.

This space intentionally left blank.

dinsdag 29 augustus 2006 16:40

Acties:

no11

Topicstarter

dot.K schreef op dinsdag 29 augustus 2006 @ 16:25:
[...]

Ik denk dat je echt beter eens een boek vastneemt. Bovenstaande oplossingen doen het echt wel. Ofwel is je vraag niet duidelijk, ofwel heb je ergens fouten zitten.

CSS is een debug nightmare met momenten, maar dit is dead easy.

Ik denk dat jullie mij verkeerd begrijpen dan ..

Ik wil dus dat het plaatje, in dit geval een voetbal rechtsonderin vast staat. Dit lukt me wel met background. Maar over die voetbal mag géén tekst komen. In jullie gevallen en met background gebeurd dat wel.

Sorry als ik niet duidelijk ben geweest..?
Afbeeldingslocatie: http://img175.imageshack.us/img175/8555/got2vl2.jpg

Afbeeldingslocatie: http://img175.imageshack.us/img175/8555/got2vl2.jpg

Ik kan het dus ook wel met background doen, dan moet ik steeds op enter drukken, geen probleem. Maar als ik later dan een cms systeempje in wil bouwen wordt dat veel te lastig..

[ Voor 12% gewijzigd door no11 op 29-08-2006 16:47 ]

woensdag 30 augustus 2006 15:16

Acties:

no11

Topicstarter

Weet iemand misschien hoe dit heet in javascript?

woensdag 30 augustus 2006 15:41

Acties:

Reinier

\o/

Zoiets dus:
http://css.maxdesign.com.au/floatutorial/tutorial0102.htm

Ga alsjeblieft NIET voor de optie "dan moet ik steeds op enter drukken, geen probleem.", javascript is ook nergens voor nodig. En gebruik de Edit-knop

woensdag 30 augustus 2006 16:11

Acties:

no11

Topicstarter

Reinier schreef op woensdag 30 augustus 2006 @ 15:41:
Zoiets dus:
http://css.maxdesign.com.au/floatutorial/tutorial0102.htm

Ga alsjeblieft NIET voor de optie "dan moet ik steeds op enter drukken, geen probleem.", javascript is ook nergens voor nodig. En gebruik de Edit-knop

Dat had ik al voor elkaar maar nu wil ik dat oranje blok onderaan hebben dat krijg ik nog steeds met geen mogelijkheid voor elkaar!