Table: vorm cel aanpassen?

Pagina: 1
Acties:

Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
Hoi allemaal,

Vandaag liep ik tegen een probleem aan bij het maken van een website. Ik heb een table waarbij ik wil dat één cel om een bepaald plaatje heen loopt. Ik wil niet dat hij in tweeën wordt gesplitst, omdat er ook tekst in komt.
Daarom zou de cel van vorm moeten veranderen (zie plaatje).
Ik heb van alles geprobeerd en overal gezocht, maar ik kan simpelweg niet vinden hoe ik dat voor elkaar krijg. Misschien is het heel simpel, maar ik kom er gewoon niet achter. Wie kan mij helpen?

Groetjes,

Nell

Afbeeldingslocatie: http://img399.imageshack.us/img399/175/tablee.jpg

Acties:
  • 0 Henk 'm!

  • MrVegeta
  • Registratie: September 2002
  • Laatst online: 11-09 20:46

MrVegeta

! Dolf is rechtvaardig !

Dus het zwarte blok is je tabel waar je tekst in wil de witte uitknipsel is waar je je plaatje wil?

Volgens mij kan je het ook anders doen, namelijk met CSS en layers. Je maak een layer waar je je tekst in plaats. In die layer maak je weer een layer en die positioneer je rechts onder, op die manier zal de tekst er om heen gaan.

Heb je al wat met CSS gewerkt?

Geeft steekhoudelijke argumenten terwijl hij niet weet waar het over gaat. BlizzBoys, HD casts van StarCraft II gemaakt door Tweakers! Het begint, Zombiepocalyps


Acties:
  • 0 Henk 'm!

  • Cousin Boneless
  • Registratie: Juni 2008
  • Laatst online: 28-02 12:55
Dat zal niet gebeuren. Zodra je in CSS aangeeft bottom:0px, dan wordt het absoluut gepositioneerd en zal de tekst niet om je plaatje floaten, maar er overheen gaan.
Volgens mij is hier alleen een vrij smerige truuk voor, die alleen werkt als de hoogte van je cel en de hoogte van het plaatje is gegeven:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
<table>
    <tr>
        <td style="height:200px;width:300px;border:1px solid black">
            <div style="float:right;width:1px;height:100px;margin-bottom:-1em;background-color:red"></div>
            <div style="float:right;width:100px;height:100px;clear:right;margin-top:1em;background-color:green"></div>
tralala pomtidom tralala pomtidom tralala pomtidom tralala pomtidom
tralala pomtidom tralala pomtidom tralala pomtidom tralala pomtidom
tralala pomtidom tralala pomtidom tralala pomtidom tralala pomtidom
tralala pomtidom tralala pomtidom tralala pomtidom tralala pomtidom
tralala pomtidom tralala pomtidom tralala pomtidom tralala pomtidom
        </td>
    </tr>
</table>

Zoiets meen ik me te herinneren. 2x floaten right, waarbij de bovenste floating div geen breedte heeft, maar enkel de 2e naar beneden drukt. Die oplossing kwam ik ergens (na vrij lang zoeken) tegen, maar helaas niet gebookmarkt.

Acties:
  • 0 Henk 'm!

  • Cascade
  • Registratie: Augustus 2006
  • Laatst online: 16-09 11:44
Leuk probleem. Die 'pusher float clear' methode van Cousin Boneless is the way to go, iets anders is er zo 123 niet denk ik (zolang er geen 'float: bottom' is in CSS). Nadeel is dat je afmetingen van te voren bekend moeten zijn tenzij je aan de slag wil gaan met javascript of misschien expressies in css (niet aan te raden).
(die bovenste 1px div moet dan ook een clear: right hebben, anders gaat het mis)

[ Voor 12% gewijzigd door Cascade op 10-07-2009 00:53 ]