2 overlappende divs in 1 table

[Verwijderd]

beste,

Ik wil voor een votingsysteem een balkje maken die adhv de score 'volloopt' (width=percentage, geen animatie ofzo) en daarop gecentreerd de score in text.
Mijn idee is dat ik daar 2 divs voor moet maken, 1 waarin het plaatje gerekt word, en nog 1 erboven met daarin de text.
Kan iemand mij uitleggen (liefst een klein voorbeeld) hoe je 2 divs letterlijk op elkaar legt in een table van x bij y zodat de text op het plaatje ligt?

voorbeeld van hoe het BIJNA moet: http://www.jollyland-studios.net/files/divvoorbeeld.jpg
De text moet nu dus OP de balk.


Bij voorbaat dank, en groet,

Michel.

[ Voor 15% gewijzigd door Verwijderd op 15-06-2006 22:42 ]

[XWB]

De div met de score absoluut in de eerste div positioneren? Maar volgens mij moet dit ook met 1 div kunnen.

[Verwijderd]

Ben nog even aan het piemelen geweest, heb nu deze code:

<div align="left" style="width:100%;"><div align="center" id="2" style="position: absolute;width:50px;"><span class="body_small" align="center" valign="middle"><%= RatingAverage %></span></div>[img]"images/vote_<%=[/img]_middle.jpg" border="0" align="absmiddle" height="14" width="<%= (RatingAverage / 2 ) %>">


Nu staat de text wel op het balkje, maar ik krijg hem nu niet in het midden gecentreerd.
Suggesties?

edit:

AHA! nu issie wel correct... Alleen is dit niet echt de manier... Kan iemand dit namaken zodat het wel enigzins christelijke code is?

[ Voor 34% gewijzigd door Verwijderd op 15-06-2006 23:00 ]

[Boelie-Boelie]

Wat voorbeelden: http://apples-to-oranges.com/blog/article.aspx?id=55

Overigens, absoluut positioneren is vaak niet nodig. Gewoon wat pielen met height, width, margins/paddings en text-align moet denk ik genoeg zijn (evt. line-height).

[ Voor 7% gewijzigd door Boelie-Boelie op 16-06-2006 00:05 ]

[BalusC]

Andere voorbeelden:
http://balusc.xs4all.nl/srv/sta-srv.php (verticaal)
http://balusc.xs4all.nl/srv/sta-srv-pag.php (horizontaal)

[Cartman!]

HTML:

<div class="wrapper">
<div class="image">[img]"plaatje.gif"[/img]</div>
<div class="text">nummer</div>
</div>

Zo zou ik het doen, het je dit gaat stijlen is aan jou, maar absolute positionering is niet nodig iig.

[BalusC]

Absolute positionering is wel nodig wanneer je geen gebruik wilt maken van plaatjes om grafiekjes te invullen Althans, dat heb ik ondervonden tijdens het devven van mijn CSS-only statsgrafieken.

[ Voor 3% gewijzigd door BalusC op 16-06-2006 10:18 ]

[disjfa]

g00fy schreef op vrijdag 16 juni 2006 @ 10:14:

HTML:

<div class="wrapper">
[img]"plaatje.gif"[/img]
nummer
</div>

Zo zou ik het doen, het je dit gaat stijlen is aan jou, maar absolute positionering is niet nodig iig.

Ik heb even je code aangepast. Al die div`s zijn al net zo nodig als al je position absolutes.

[Cartman!]

disjfa schreef op vrijdag 16 juni 2006 @ 10:18:
[...]

Ik heb even je code aangepast. Al die div`s zijn al net zo nodig als al je position absolutes.

kwestie van smaak denk ik.
Hoe ga je trouwens zonder width en height die image de goede maat geven? 100 verschillende gifjes?
En wil je een float op je image gooien? Kies ik toch liever voor een exra div.

[ Voor 11% gewijzigd door Cartman! op 16-06-2006 11:27 ]

[moozzuzz]

vraag

Kan je gebruik maken van php? In dat geval zou ik dit graphje laten creeeren door PHP. Nadeel is dat de meeste webservers een zeer beperkt aantal lettertypes ondersteunen...

[Technicality]

moozzuzz schreef op vrijdag 16 juni 2006 @ 17:32:
[...]

Kan je gebruik maken van php? In dat geval zou ik dit graphje laten creeeren door PHP. Nadeel is dat de meeste webservers een zeer beperkt aantal lettertypes ondersteunen...

En dat het een hoop resources vreet. Ik vind zelf de apples & oranges manier de beste (die gebruik ik dan ook voor een intranet-reserverings-syteem)

[Verwijderd]

moozzuzz schreef op vrijdag 16 juni 2006 @ 17:32:
[...]In dat geval zou ik dit graphje laten creeeren door PHP. Nadeel is dat de meeste webservers een zeer beperkt aantal lettertypes ondersteunen...

Zelf heb ik eens een dynamisch organogram in elkaar geprutst met grafische fizzle in php. Ik kon daarbij (op Windows XP overigens) gewoon een True Type Font-file in een willekeurige directory zetten, en hiernaar refereren. Werkt perfect, maar ik geloof wel dat het coord-systeem iets anders is dan bij een mono spaced lettertype.