Ondersteuning » Thema en CSS/opmaak » Foto's in submenu centreren onder parent

  • Hallo,

    Sinds een week of 3 ben ik bezig met het opstarten van een WordPress. Alles is nog behoorlijk nieuw voor me, dus ik hoop dat ik mijn probleem duidelijk kan beschrijven.

    Voor mijn site wil ik een horizontaal dropdown-menu maken, met horizontale submenu’s. De basis is er nu, alleen ziet het er nog niet helemaal netjes uit. Het probleem is dat de items van de submenu’s niet gecentreerd worden onder de parent, waardoor het er wat vreemd uitziet.

    Het probleem laat zich het best zien wanneer je over het kopje “fotografie” hovert: http://www.bugshot.nl/

    Als ik de position bij #navi li.hover ul op relative zet, worden de items wel gecentreerd zoals ik het wil, maar dan blijven de items allemaal in de header plakken, ipv dat ze er als een submenu onder komen te staan.

    Ik hoop dat ik jullie bij deze genoeg geïnformeerd heb. Het lijkt me vrij simpel op te lossen, maar ik kom er niet alleen uit. Alle hulp is dus van harte welkom!
    Met vriendelijke groet,
    Mark

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • ul.children{
         margin-left:-70px;
    }

    Als je theme een optie heeft om de CSS aan te passen, bijvoorbeeld in een ‘custom css’-veld, plaats dan de aanpassing[en] aan je css hierin.
    Ontbreekt een dergelijke optie in je theme? Volg dan de instructies hieronder.

    Alternatief: Voeg bovenstaande code toe aan style.css van je CHILDtheme.
    Zo voorkom je dat al je aanpassingen worden overschreven als de makers van je theme een update installeren.
    Verder heeft het als voordeel dat alle aanpassingen overzichtelijk bij elkaar staan. Dat is makkelijk, overzichtelijk en eenvoudiger te onderhouden.

    Kies je ooit een ander theme, dan dien je een nieuw childtheme te maken.

    Heb je nog geen childtheme?

    1. installeer en activeer ‘one click childtheme’-plug-in
    2. activeer de originele theme
    3. Dashboard > weergave > child theme
    4. beantwoordt de vragen op het scherm
      >> er wordt een child theme aangemaakt in een map met bestanden zoals style.css;
    5. Activeer het childtheme.
    6. ==

    7. om je site aan te passen, maak je nu alle wijzigingen in de map en bestanden van je child theme.
      – Maak je aanpassingen in style.css van het childtheme;
      – mocht je aanpassingen willen maken in de originele php-bestanden, kopieer de betreffende php-file uit het originele theme naar de map van het childtheme. Maak hierin dan de gewenste aanpassingen.

    == == == Extra
    Als je precies wilt zien welke elementen je site heeft en welke opmaak-kenmerken [css] daarbij horen, installeer dan bijv de browser-add-on ‘firebug’ of een andere webdeveloper plugin / add-on.

    Zo kan je op zoek naar de diverse elementen en de kenmerken zoals kleuren etc. aanpassen.

    Thread starter markh3

    (@markh3)

    Super bedankt voor je hulp! Ik heb een child theme aangemaakt nu, iets waar ik totaal nog niet aan gedacht had.

    Echter lijkt de code voor het menu niet veel te doen.

    Gek, Ik heb ‘m op je site geprobeerd. Ik kijk morgen even verder

    Thread starter markh3

    (@markh3)

    Ben nog eens wat aan het prutsen geweest, en je had inderdaad gelijk! Voor de submenu’s die bestaan uit 1 thumbnail werkt die 70px prima. Het enige wat ik nu nog graaf zou willen weten, hoe krijg ik de submenu’s met meerdere thumbnails netjes gecentreerd?

    Als het submenu bijvoorbeeld uit 5 thumbnails bestaat, dan zou ik er graag 2 aan de linkerkant van de parent hebben, 1 er direct onder en de andere 2 aan de rechterkant. Dit geld eigenlijk vooral voor het submenu “fotografie”.

    http://www.bugshot.nl/

    In ieder geval al heel erg bedankt voor de hulp!

    Sorry, Nu je verder beschrijft wat je wilt, begin ik ‘m te snappen.
    Ik kreeg de indruk uit de eerdere vraag dat alleen de eerste thumbnail gecentreerd moest worden.
    Effe denken en kijken of ik iets kan verzinnen.

    Hoi markh3,
    Als je dit met css wilt oplossen, zul je met de nht-childselector moeten werken, zodat je ieder element van het submenu eigen css-eigenschappen kunt geven. Veel werk, waarbij ruime ervaring met Firebug enorm van pas komt.
    Succes!
    Lianne

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • Het onderwerp ‘Foto's in submenu centreren onder parent’ is gesloten voor nieuwe reacties.