Ondersteuning » Thema en CSS/opmaak » Twitter logo margin top 500 px lukt niet

  • Opgelost omni2250

    (@omni2250)


    Ik ben bezig met deze site:http://work.nicerdicer-plus.be/

    Het Twitterlogo wil ik naast het adres hebben staan. Dus 300 px naar beneden.
    In de Widget heb ik de volgende HTML staan:

    <div id=”menu”>

    </div>

    <div id=”adres”>

    Schoolstraat 3
    6901 HD ZEVENAAR

    Tel: 0316-580870
    Fax: 0316-580871
    Mob: 06-18940182

    </div>

    <div id=”img”>

    <img class=”alignnone size-full wp-image-37″ src=”http://work.nicerdicer-plus.be/wp-content/uploads/2015/05/twitterlogo.png&#8221; alt=”twitterlogo” width=”40″ height=”40″ />

    </div>

    In het Child theme heb ik de volgende CSS staan:

    /*
    Theme Name: child
    Description:
    Author: admin
    Template: nieuweronde3

    (optional values you can add: Theme URI, Author URI, Version, License, License URI, Tags, Text Domain)
    */

    #menu ul {
    list-style-type: none;
    width: 50px; /* Nieuw */
    }
    #menu ul li {
    margin: 00;
    }
    #menu ul li a {
    display: block;
    padding: 10px;
    background-color: #000000;
    font-family: Verdana;
    color: white;
    position: relative;
    top: 0px;
    left: 29px;
    width: 165px;
    }
    #menu ul li a:hover {
    background-color: #71c32a;
    }

    p.pos_fixed {
    position: fixed;
    top: 30px;
    right: 5px;
    }

    .container {
    position: absolute;
    margin: 0 auto;
    width: 100px;
    height: 100px;
    top: 50%;
    left: 50%;
    margin-left: -50px;
    margin-top: -50px;
    background-color:#FF0000;
    }

    .art-postheader {
    color: #616161;
    margin: 0 0 0 0px;
    font-size: 22px;
    font-family: ‘Century Gothic’, Arial, ‘Arial Unicode MS’, Helvetica, Sans-Serif;
    padding-right: 250px;
    }

    .art-postcontent {
    font-family: Arial, ‘Arial Unicode MS’, Helvetica, Sans-Serif;
    text-align: justify;
    }

    #adres {
    text-align: justify;
    color: #616161;
    margin: 00 60 0 0px;
    font-size: 14px;
    font-family: ‘Century Gothic’, Arial, ‘Arial Unicode MS’, Helvetica, Sans-Serif;
    padding-left: 50px;
    position: absolute;
    top: 500px;
    text-align: justify;

    }

    }

    #img {
    position: relative;
    top: 300px;
    right: 5px;
    }

    Er gebeurt verder niets, hoe kan dat?

    Tevens wil ik de adres gegevens uitvullen, maar dit werkt ook niet.

    Alvast bedankt.

    Gr R

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

    Dit komt doordat je een ] teveel in de declaratie daarboven hebt gezet.

    #adres {
    text-align: justify;
    color: #616161;
    margin: 00 60 0 0px;
    font-size: 14px;
    font-family: 'Century Gothic', Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
    padding-left: 50px;
    position: absolute;
    top: 500px;
    text-align: justify;
    
    }
    
    }  ========>>>> WEGHALEN !!!!!!!!!!!!!
    
    #img {
    position: relative;
    top: 300px;
    right: 5px;
    }

    Overigens: als ik het mag opmerken, en met alle respect voor je klinkende ontwerp: het aldus positioneren van div-jes is sinds de komst van tablets en smartphones een beetje uit gebruik geraakt, omdat je totaal verstrikt raakt in de noodzaak om voor deze devices eindeloze aangepaste css op te nemen. Het is beter om te werken met de natuurlijke flow van je pagina-opzet.

    groet,
    Lianne

    Thread starter omni2250

    (@omni2250)

    Dankjewel Lianne Werkt nu. Weet je ook toevallig hoe het kan dat de “justify” niet werkt?

    Bedoel je text-align justify in het adresblok? Deze eigenschap zorgt voor links en rechts vertikaal uitgelijnde teksten, zoals je gewend bent van een krant. Geschikt voor doorlopende tekst, maar niet voor adresgegevens, die je over enkele regels verspreidt, maar nooit de breedte vullen -verre van.

    In mijn vorige post maakte ik een opmerking over dit ontwerp voor tablet en mobiel. Heb je de website op een telefoon bekeken?

    groet,
    Lianne

    Thread starter omni2250

    (@omni2250)

    Inderdaad, heb ik gezien. Wordt aan gewerkt.

    Is je vraag beantwoord? (ik heb even gekeken, volgens mij wel) zou je dan dit topic willen sluiten?

    Thread starter omni2250

    (@omni2250)

    idd opgelost. Slotje

6 reacties aan het bekijken - 1 tot 6 (van in totaal 6)
  • Het onderwerp ‘Twitter logo margin top 500 px lukt niet’ is gesloten voor nieuwe reacties.