• Ik heb een template geïnstalleerd en ben met het bouwen van mijn website begonnen (eerste keer dat ik dat doe). Ik loop echter al vrij snel tegen een probleem aan.

    Als ik teveel tekst toevoeg dan gaat er iets fout met de layout.

    Voorbeeld: http://www.erfrechtonline.nl/wet/

    Hier zie je dat de linkeritem is veranderd. Er is een stukje wit onder gekomen en de ‘meer’ knop is verschoven.

    Hetzelfde bij http://www.erfrechtonline.nl/pagina-1/
    De tekst overlapt hier andere tekst.

    Zijn deze problemen eenvoudig op te lossen?

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • Voor de pagina http://www.erfrechtonline.nl/pagina-1/:

    In je style.css (of liever een child css hiervan) dien je het volgende aan te passen:

    #clients ul.clients li {
       /* position: absolute; */
       top: 0;
       right: 0;
       transition: all 0.3s;
    }

    Er verschijnt dan alleen nog een blauwe afbeelding met paperclip onderin de pagina maar die kun je als het goed is weghalen of veranderen via het thema, althans dan vermoed ik.

    Voor de pagina http://www.erfrechtonline.nl/wet/:

    In je style.css (of liever een child css hiervan) dien je het volgende aan te passen:

    #team > ul > li p {
       margin-bottom: 10px;
       line-height: 16px;
    }

    In het laatste stuk: hou er rekening mee dat de blokken waarin de tekst moeten komen een beperkte ruimte/hoogte hebben. Dit is hoe het thema is opgebouwd. Wil je meer tekst hierin toevoegen dan moet je al snel de broncode van de template zelf aanpassen want de afbeelding links zal niet automatisch meerekken in hoogte. Via wat smerige trucjes (position: absolute; op afbeeling) kun je ervoor zorgen dat hij altijd op de bodem plakt van het tekstkader.

    Meest nette en gangbare oplossing is om de afbeelding als achtergrondafbeelding in te stellen de div eromheen om te zetten naar een “a href” met een display: block. Vervolgens dien je de afbeeling hoger te maken en hierin in te stellen als background-image met position: bottom left;.

    Bovenstaande oplossing vergt echter wat kennis van html/css dus kan me voorstellen dat het lastig is. Je kunt echter ook iemand in de arm nemen om dit voor je te doen. Dat kan ik, of iemand van dit forum (of extern bureau, maar dat kan snel duur worden).

    Thread starter Arend80

    (@arend80)

    Beste Ruud,

    Bedankt voor je reactie.
    Het aanpassen van de style.css is gelukt.

    De foto met de paperclip kan ik echter niet in het thema verwijderen. Hoe kan ik dat oplossen?

    Welke blokken tekst bedoel je precies? De samenvatting voor het woordje ‘meer’? Of bedoel je de pagina die verschijnt als je op ‘meer’ klikt? Zoals de weergave nu is, heb ik er geen probleem mee (alhoewel ik de afbeeldingen nog zal wijzigen).

    Thread starter Arend80

    (@arend80)

    Het is overigens niet alleen de foto met de paperclip die nog een probleem oplevert. Als je bijvoorbeeld op (dezelfde pagina) op onderwerp 14 klikt, dan komt rechts onderwerp 13 (wat uiteraard niet klopt, dit moet ook 14 zijn).

    Thread starter Arend80

    (@arend80)

    En als ik op de pagina http://www.erfrechtonline.nl/wet/ een item toevoeg met (wederom) een grote hoeveelheid tekst, dan verspringt de layout opnieuw. Ik verwacht op deze pagina overigens uiteindelijk 11 items te plaatsen.

    Enige idee hoe ik deze problemen kan verhelpen?

    Ja zoals ik al eerder aan gaf dien je wat aanpassingen te maken aan de template. Echter moet je hier wel wat kennis van hebben wat betreft html/css/php gezien de wijzigingen in de template zelf gemaakt moeten worden.

    Je hebt helaas het nadeel dat de template niet flexibel opgemaakt is wat betreft dynamische hoogte.

    Beste oplossing voor de pagina /wet/ is om de afbeelding 300px hoger te maken, in te stellen als achtergrond binnen dat blok en uit te laten lijnen op de bodem van de div. Op deze manier schaalt ie altijd mee. Als je dit doet door alles in een < a href > te zetten en deze als display: block instelt, ben je al een heel eind.

    Thread starter Arend80

    (@arend80)

    Kan ik je de inloggegevens sturen, zodat je de nodige wijzigingen in de template kunt maken?

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)

Het onderwerp ‘Probleem met layout en tekst’ is gesloten voor nieuwe reacties.