Ondersteuning Volgende » CSS / opmaak vragen Volgende » Logo boven header in twenty eleven

  • Opgelost Annoj

    (@annoj)


    Ik ben bezig met het bouwen van een website. Graag wil ik boven de header het logo van de organisatie plaatsen. Hiervoor heb ik de onderstaande code gebruikt. Het logo is zichtbaar, maar ik wil het graag uitlijnen met de heaader.
    Iemand die mij kan helpen?

    <img padding-left: 20px; width=”1000″ height=”72″ alt=”adcam-logo-header-zonder-dienstverlening” src=”http://www.projectjonna.hu.nl/wp-content/uploads/2013/05/adcam-logo-header-zonder-dienstverlening.jpg.jpg”>

15 reacties aan het bekijken - 16 tot 30 (van in totaal 37)
  • Ik maak eerst een voorbeeld en meld je vervolgens het resultaat.

    #branding img {
        width: 30%;/* pas het percentage aan*/
    }

    De tussenruimte kan ik nog niet ‘bijstellen’.

    Deze code werkt bij mij niet….

    De code die je eerder hebt toegevoegd lijkt nu te zijn verdwenen.

    [...]</head>
            <div id="page" class="hfeed">
    	<!-- toevoeging -->
    	<img padding-left: 20px; width="376" height="113" src="http://www.projectjonna.hu.nl/wp-content/uploads/2013/05/logo-met-oranje.jpg" alt="Logo Adcam-Administratie" alt="Logo Adcam-Administratie">
    	<!-- einde toevoeging -->[...]

    Het is nu wel gelukt om het logo kleiner te maken!
    Maar de afstand tussen het logo en de slider krijg ik niet kleiner. Enig idee?

    !! Maak eerst een backup van de huidige situatie[ je weet maar nooit… 😉 ]

    Probeer dit eens [childtheme – style.css]

    .easingsliderlite.is-firefox.use-fade.use-css3 {
        width: 1000px;
        height: 10.35em;
        top: -36px;
    }

    Waar moet ik de tekst plaatsen?

    in de style.css van je childtheme.

    == == == extra info

    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.

    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.

    het lukt me niet om de juiste plaats in de php van het childtheme te vinden waar ik de code moet toevoegen

    1. In map van je childtheme, staat een bestand dat heet ‘style.css’.
    2. Open ‘style.css’ in een editor
    3. voeg bovenstaande code toe aan dit bestand en sla het op
    4. upload het ‘style.css-bestand weer naar de map van je childtheme [overschrijf het oude]
    5. Browser: ververs je browser

    Ik heb de code toegevoegd aan de stylesheet, maar er verandert niets

    .easingsliderlite {
        position: relative !important;
        top: -37px;
        height:213px;
    }

    deze code geeft ook geen resultaat

    Vreemd; Ik heb ze allebei getest op jouw site, en ze werkte beide.

    Vreemd; Ik heb ze allebei getest op jouw site, en ze werkte beide.

    Test je style.css eens als volgt:
    Voeg deze code ONDERAAN in de style.css.

    *{
         color:#99cc66; /*de tekst wordt appelgroen*/
    }

    Druk op <CTRL-F5> en bekijk het resultaat.

15 reacties aan het bekijken - 16 tot 30 (van in totaal 37)
  • Het onderwerp ‘Logo boven header in twenty eleven’ is gesloten voor nieuwe reacties.