[CSS] Rollover plaatje niet in vak.

[The Milkman]

Hallo,

op http://txt.bertlog.com/ staat een rollover-css-plaatje.
Deze zou ik graag in het vak krijgen, maar hij valt er half buiten.

Ik wil dat ie zich gedraagt als een normaal plaatje... Is dat mogelijk?
Het lukt mij niet om dit te realiseren.

[Borizz]

Omdat je je link element met de class smart_rollover naar left float. Zal je de boel aan het einde van de div met id=middle moeten clearen om ervoor te zorgen dat het plaatje geheel binnen je div valt.

[The Milkman]

Als ik float:left weghaal, verdwijnt het plaatje in zijn geheel...

En wat bedoel je met: "einde van de div met id=middle moeten clearen"?

[ Voor 35% gewijzigd door The Milkman op 21-10-2006 19:43 ]

[BasieP]

The Milkman schreef op zaterdag 21 oktober 2006 @ 19:43:
Als ik float:left weghaal, verdwijnt het plaatje in zijn geheel...

En wat bedoel je met: "einde van de div met id=middle moeten clearen"?

ik zou als ik jouw was eens zoeken naar tutorials over floating elements in css, daarbij komt 'clearen' ook aan de orde als het goed is

[The Milkman]

Pff, ik kom er nog niet echt uit. Misschien moet ik wel gewoon rollovers maken met javascript. CSS lukt me nog niet zo. Toch bedankt!

[neothor]

Dan geef je wel snel op.

kijk eens hier en hier ook zijn er heel veel tutorials hierover te vinden.

Een evt oplossing voor jouw probleem is:

HTML:

<div id="middle">
Welcome to Code Dump.<br>
Welcome to Code Dump.<br><br>
Welcome to Code Dump.<br>
<a href="#" class="smart_rollover"></a>
Welcome to Code Dump.<br>
Welcome to Code Dump.<br>
<br>

<div style="clear: both">&nbsp;</div>
</div>

[Borizz]

The Milkman schreef op zaterdag 21 oktober 2006 @ 19:43:
Als ik float:left weghaal, verdwijnt het plaatje in zijn geheel...

En wat bedoel je met: "einde van de div met id=middle moeten clearen"?

Een display: block; op je link element doet ook wonderen..

neothor schreef op zaterdag 21 oktober 2006 @ 20:13:
Dan geef je wel snel op.

kijk eens hier en hier ook zijn er heel veel tutorials hierover te vinden.

Een evt oplossing voor jouw probleem is:

HTML:

<div id="middle">
Welcome to Code Dump.<br>
Welcome to Code Dump.<br><br>
Welcome to Code Dump.<br>
<a href="#" class="smart_rollover"></a>
Welcome to Code Dump.<br>
Welcome to Code Dump.<br>
<br>

<div style="clear: both">&nbsp;</div>
</div>

Hiermee is het inderdaad opgelost, maar nu snapt de TS nog niet waarom.

[The Milkman]

Ok, tof. Ik denk dat ik het ongeveer snap. Maar niet wist waar ik dat clear moest zetten.
Ik kan weer even verder.
Dank jullie wel

[BasieP]

The Milkman schreef op zaterdag 21 oktober 2006 @ 23:35:
Ok, tof. Ik denk dat ik het ongeveer snap. Maar niet wist waar ik dat clear moest zetten.
Ik kan weer even verder.
Dank jullie wel

je moet altijd het element wat volgt op floating zooi clearen,
dwz, als je een content hebt met bijv links een divje dan rechts een divje, en daaronder een footer, moet je footer dus 'clear: left;' zijn als je 'float: left;' hebt gebruikt, en 'clear: all;' als je zeker wilt weten

[Borizz]

BasieP schreef op zaterdag 21 oktober 2006 @ 23:49:
[...]

je moet altijd het element wat volgt op floating zooi clearen,
dwz, als je een content hebt met bijv links een divje dan rechts een divje, en daaronder een footer, moet je footer dus 'clear: left;' zijn als je 'float: left;' hebt gebruikt, en 'clear: all;' als je zeker wilt weten

Ik zou er 'clear: both;' van maken ipv 'clear: all;' .