Support » CSS / opmaak vragen » Hulp gevraagd bij ‘wit vlak’ homepage

  • Opgelost brwie

    (@brwie)


    Hallo,

    Via wordpress heb ik een site gemaakt. Hiervoor heb ik gebruik gemaakt van het thema voguish. Alle gewone informatie heb ik weggehaald en de site gevuld met behulp van de plugin WPBakery Page Builder.

    Nu blijft er alleen op de homepage een wit vlak tussen de menubalk en de eerste foto. Vooral wanneer je de site op een mobiele telefoon bekijkt is dit witte vlak nogal groot en daar stoor ik mij aan. Op de andere pagina’s van de website werkt dit wel gewoon naar behoren.

    Zelf kan ik niet vinden waar dit probleem hem in zit en hoe ik het aan kan passen. Ik hoop dat iemand mij hier verder kan helpen?

    Dankjewel!
    Groeten Bregje

    De pagina waar ik hulp bij nodig heb: [log in om de link te zien]

8 reacties aan het bekijken - 1 tot 8 (van in totaal 8)
  • Ps, Ik heb geprobeerd deze code via customizer en via het thema toe te voegen:

    .site-content {
    padding: 0;
    }

    Zonder effect.

    Ook deze tekst heeft geen effect:

    .page-template-template-homepage:not(.has-post-thumbnail) .site-main {
    padding-top: 0;
    }

    • Deze reactie is gewijzigd 1 maand, 2 weken geleden door brwie.
    • Deze reactie is gewijzigd 1 maand, 2 weken geleden door brwie.

    Hoi, deze heeft een margin, geen padding. Dit zou moeten werken:

    /* mobile first: dus mobiel tot 768px breedte */
    .more-space-top.page_content-wrapper { 
        margin-top: 10px;
    }
    
    /* vanaf 768px breedte en hoger */
    @media (min-width: 768px) {
        .more-space-top.page_content-wrapper { 
            margin-top: 30px; 
        }
    }

    Hallo Ruud, bedankt voor je berichtje. Voor de website op computer heeft dit het gewenste effect. Alvast super bedankt!!! Helaas blijft hij op mobiel nog steeds een witvlak geven (ook als ik het aantal punten aanpas geen verandering). Mocht je hierbij kunnen helpen hoor ik het heel graag. Bedankt!

    • Deze reactie is gewijzigd 1 maand, 2 weken geleden door brwie.

    Ik heb net de CSS via mijn browser geladen en werkt wel gewoon, zie de animatie:
    https://drive.google.com/file/d/1G7Xlr8KiSKeIz-4FHZj491QM-l2OrleO/view?usp=sharing

    Je kunt nog proberen “!important” toe te voegen aan de styles. Dus bijvoorbeeld:

    .more-space-top.page_content-wrapper { 
        margin-top: 10px !important;
    }

    Via de computerbrowser werkt het inderdaad echt, daar ben ik heel blij mee. Maar de mobiele weergave blijft alleen op de voorpagina een wit gedelete wwergeven?

    Heb je reeds de CSS al toegevoegd? Ik zie voor zowel desktop als mobiel nog steeds veel ruimte.

    Ja, dit heb ik gedaan. Bij mij op de computer geeft hij hem nu echt een stuk minder dik aan. Een kleine witruimte er tussen (zoals nu / ik bekijk hem op een apple via safari) is wenselijk. Alleen dat grote vlak op mobiel is een doorn in het oog.

    En het probleem is opgelost. Hartelijk bedankt voor de hulp! Waarom het op de mobiel ineens goed is geschoten is me niet helemaal helder. Heb nog een beetje met de ingevoerde code zitten spelen en die weer hersteld. Daarna werkte het ineens. Dankjewel!

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