Image èn tekst in 1 marquee

Status
Niet open voor verdere reacties.

frans kooijman

Gebruiker
Lid geworden
22 apr 2008
Berichten
528
Weet iemand hoe je een image en een tekst tegelijkertijd in 1 marquee-regel kan zetten,
zodat zowel de image als de tekst in 1 regel vloeiend van rechts naar links gaat?

<marquee bgcolor="#00ADEF" height="30" width="100%" scrollamount="40" behavior="slide" direction="left"><img src="images/test.gif" width="100%" height="30" alt=""><strong>voorbeeld tekst <br/></marquee></strong>

Ik moet waarschijnlijk iets tussen voor "voorbeeld tekst" zetten, maar kom er niet uit.....;

Of kan het überhaupt niet, samen in 1 marquee?


Dank!!

Frans
 
Hoi Frans,
Ja, ze kunnen samen in 1 marquee! :)

Maar eerst even orde op zaken stellen in de html-volgorde:
HTML:
<marquee ... ><img ... ><strong>voorbeeld tekst <br/></marquee></strong>
De <strong> begint binnen de <marquee>-tag, en moet daar dus ook binnen eindigen:
HTML:
<marquee ... ><img ... ><strong>voorbeeld tekst <br/></strong></marquee>


Het img wordt uitgerekt (met browser-verschillen), en de tekst valt buiten de blauwe marquee-strook. De width="100%" zorgt voor de vertekening; de height="140" is even hoog als het img, en zorgt dat de tekstregel erbuiten valt.
Die gaan er alle twee uit.



Nu kan het stylen gaan beginnen. Niet in de html, maar in een stijlblok in de <head> of in een apart stylesheet.
Als de tekst achter de afbeelding aan moet bewegen, kan deze in het verticale midden van de afbeelding komen te staan, en met een afstandje ertussen.



Als de bedoeling is om de tekst onder de afbeelding te krijgen, dan kan je om de afbeelding en de tekst heen een <span> zetten met de breedte van het img, en een {text-align: center} om midden onder het img te komen. Deze span krijgt een {display: inline-block} om alles bij elkaar te houden. Sommige browsers hebben nog een <br /> tussen het img en de tekst nodig, anders komt de tekst (zelfs met een spatie ertussen!) alsnog achter het img aanwapperen ipv er onder te komen. *)



Op deze manier kan je ook verschillende plaatjes met onderschriften achter elkaar aan laten sjouwen.



NB: in alle gevallen is het niet nodig de hoogte van de marquee op te geven: die regelt zichzelf.

Met vriendelijke groet,
CSShunter
___________
*) De <marquee> is geen officiële html-code met voorschriften hoe deze precies moet werken; browsers doen het wel, maar soms op een andere manier.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan