[css] Onmogelijke opmaak - float right/bottom?

Pagina: 1
Acties:

Acties:
  • 0 Henk 'm!

Anoniem: 308713

Topicstarter
Is het volgende mogelijk in CSS? Na wat zoekwerk lijkt het antwoord negatief te zijn, maar wellicht dat een van jullie een goede opmerking heeft. Ik heb de volgende situatie:

Afbeeldingslocatie: http://i46.tinypic.com/2laq1if.png

Gewenst: er dient een rood tekstblok te zijn, waar een tekst met variabele lengte in staat (zie de afbeelding). let op: het kan bijvoorbeeld ook één woord zijn. In dit rode tekstblok, een DIV-element, dient een ander element te staan, met een vast formaat (het gele blokje, eveneens een DIV-element). Dit gele blokje dient te allen tijde rechtsonder in het rode element te staan, ongeacht de inhoud van het rode element.

Dit kun je bewerkstelligen door het gele element absoluut te positioneren (position: absoulute, right: 0 en bottom: 0). So far so good. Maar nu dient de tekst in het rode element om het gele element te lopen. Het gele element moet dus "in de weg" staan. Echter, absoluut gepositioneerde elementen staan niet in de weg; zoals te zien is op de afbeelding.

Weet iemand of dit uberhaubt mogelijk is met CSS? Dank alvast.

Acties:
  • 0 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-06 19:14
Je kunt dit effect niet bereiken met alleen CSS2. De CSS3 box layout module kan het misschien wel met box-orientation: vertical en box-direction: reverse. Heb je waarschijnlijk alleen niet zoveel aan, aangezien IE dat niet ondersteunt.

Acties:
  • 0 Henk 'm!

  • ZpAz
  • Registratie: September 2005
  • Laatst online: 18:35
Je kan het gele blokje in de 'html' toch helemaal onderaan plaatsen? (dus nog onder de tekst) en dan een float: right; display: inline; meegeven? Of gaat ie er dan onder naast staan.

Tweakers Time Machine Browser Extension | Chrome : Firefox


Acties:
  • 0 Henk 'm!

  • WeeJeWel
  • Registratie: April 2007
  • Laatst online: 08-06 21:50
Staat de hoogte van het gele blok vast?

Homey — Critics are those without skills to create.


Acties:
  • 0 Henk 'm!

  • djluc
  • Registratie: Oktober 2002
  • Laatst online: 10-06 18:45
Klein stukje javascript wat margin-top = container-height - yellowbox-height doet lost het wel op. Mooi is anders echter.