Ondersteuning » Thema en CSS/opmaak » Tekst uitlijnen met afbeelding (thumb)

Tekst uitlijnen met afbeelding (thumb)

  • Opgelost Bootjesgek HK

    (@hankooiman)


    14 jaren, 3 maanden geleden

    Hoe kan ik ervoor zorgen dat de tekst van een post (ik maak gebruik van ’the_excerpt’ op de Homepagina) mooi uitlijnt met de bovenkant van de afbeelding (ik gebruik een thumbnail) in de homepage? In FF gaat dit vanzelf goed, maar in IE komt het bericht halverwege het plaatje te hangen. Dit moet toch in het CSS op te lossen zijn door een eigenschap aan het plaatje mee te geven, of moet dat anders? In HTML is het simpel, je geeft dan op: eigenschappen afbeelding> uitlijning links. Zoiets dus, maar dan in de CSS!

    http://www.bootjesgek.com (in ontwikkeling)

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Funkphenomenon

    (@funkphenomenon)

    14 jaren, 3 maanden geleden

    In jouw template staan dingen overhoop, dat kan ervoor zorgen dat de weergave verkeerd is. Ik zie bijv. boven het doctype staan:

    <link href="assets/css/style.css" rel="stylesheet" type="text/css" /><br />
<div id="container">

    Dat moet op totaal andere plekken. De assets-regel staat zelfs twee keer in je code, dus die kan gewoon weg. In ieder geval moet er geen enkele regel boven het doctype staan.
    Dit lijkt ongerelateerd, maar wel of niet een doctype als eerste regel kan soms een wereld van verschil maken: op basis van die eerste regel wordt bepaald hoe o.a. de layoutweergave zal moeten worden.

    Thread starter Bootjesgek HK

    (@hankooiman)

    14 jaren, 3 maanden geleden

    Ik heb zelf de oplossing gevonden: ik heb in de CSS de h2 (de titel van de post)de eigenschap: display: inline meegegeven. Nu zet ook IE de tekst keurig uitgelijnd met de bovenkant van het plaatje. FF lijkt er geen last van te hebben.

    #content .recent ul li h2 {
    background-image: none;
    font-size: 1em;
    padding: 0;
    display: inline;

    http://www.bootjesgek.com

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Het onderwerp ‘Tekst uitlijnen met afbeelding (thumb)’ is gesloten voor nieuwe reacties.

Onderwerptags

Weergaven