Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Image binnen div positioneren

Anoniem
Gooly
3 antwoorden
  • Hallo,

    Graag wou ik weten hoe je een image binnen een div positioneerd ,heb al van alles geprobeerd maar het lukt nooit
    Moet ik mijn positie in Css bepalen of in html?
    HTML
    —————-
    [code:1:9ddf04640c]
    <div class="Opmaak">
    <p>bla bla bla</p>
    <img src="http://www.computerforum.be/Foto's/Kranten-1.gif" alt="Foto-Home" width="375" height="250" />

    </div>[/code:1:9ddf04640c]

    [code:1:9ddf04640c]
    div.Opmaak{
    background:url("../Achtergrond/achtergrond-bruin-transparant.png");
    /*filter:alpha(opacity=50);*/
    margin : 5% 50% 50% 1%;
    /*top, right, bottom and left*/
    text-align:left;
    font-family:"Goudy Old Style";
    font-size:120%;
    font-stretch:expanded;
    border:2px ridge;[/code:1:9ddf04640c]
  • In CSS. En daar zijn verschillende manieren voor. Het hangt ook een beetje af van waar je de afbeelding wilt hebben.
    ALs je de image met css gaat positioneren, dient hij een eigen CSS entry te krijgen.
    b.v.
    [code:1:59d1a4f052]
    .Opmaak img{
    float: right;
    margin: 5px;
    }
    [/code:1:59d1a4f052]
    (De afbeelding tegen de rechter zijkzant van de DIV aan met een marge van 5 pixels er omheen.)

    Je kunt ook nog absloluut positioneren, maar dat zou ik alleen doen als het echt niet met float lukt. Als je er weinig ervaring mee hebt zouden er onvoorspelbare dingen mee kunnen gebeuren.
    [code:1:59d1a4f052]
    img.gepositioneerd{
    position: absolute;
    left: 25px;
    top: 20 px;
    }
    [/code:1:59d1a4f052]
    (Zet de afbeelding 25 pixels van de linkerkant af, en 20 pixels van de bovenkant, ten opzichte van de 'moeder' div)
  • Hallo,
    Alvast bedankt!

    Ik heb zoals je zei een .opmaak img gemaakt in css
    maar wel buiten mijn andere div Het ziet er als volgt uit:
    [code:1:f8e92dc8c3]div.Opmaak{
    background:url("../Achtergrond/achtergrond-bruin-transparant.png");
    /*filter:alpha(opacity=50);*/
    margin : 5% 50% 50% 1%;
    /*top, right, bottom and left*/
    /*text-align:left;*/
    font-family:"Goudy Old Style";
    font-size:120%;
    font-stretch:expanded;
    border:2px ridge;
    /*background-position:right;*/
    position:absolute;
    }
    .Opmaak img{

    float: right;

    } [/code:1:f8e92dc8c3]
    Je ziet dat position :absolute in mijn eerste div staat als ik die in mijn 2e div zet komt mijn image buiten de gewone div

    Dit is eigenlijk de bedoeling van mijn werk maar het moet wel een stuk.smaller zijn [img:f8e92dc8c3]http://img715.imageshack.us/img715/9186/20101227144002.jpg[/img:f8e92dc8c3]

Beantwoord deze vraag

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.