Avatar billede Hans1 Praktikant
22. april 2011 - 18:50 Der er 5 kommentarer og
1 løsning

Placering af image

Hej

jeg benytter mig af følgende kode til at placere et billed oven på et andet. Jeg har så det problem at jeg godt kunne tænke mig at billed 1 blev gjort centreret vandret af de 300px som den første flot laver på første linie.


<div style="float:left;width:300px;">

<p style="position:relative;width:100px;height:82px;">
<img style="position: absolute; top: 0; left: 0; z-index: 2;" src="billed2.png" />
<img style="position: absolute; top: 0; left: 0; z-index: 1;" src="billed1.jpg">
</p>

</div>

<div style="float:left;width:200px;">
tekst her
</div>
Avatar billede Slettet bruger
23. april 2011 - 13:25 #1
Hvis billede1 er 100 pixels bredt, og skal centreres i div'en, og de to billeder stadig skal følges ad:

<div style="float:left; width:300px; height:82px;">
    <p style="position:relative;">
        <img style="position:absolute; top:0px; left:100px;" src="billed1.jpg">
        <img style="position:absolute; top:0px; left:100px;" src="billed2.png">
    </p>
</div>
Avatar billede Slettet bruger
23. april 2011 - 13:28 #2
Evt. lige give <p>'en en omgang  margin:0;padding:0;  hvis den spiller smart :)
Avatar billede Hans1 Praktikant
23. april 2011 - 15:45 #3
Billed 1 har forskellige størrelser da den bliver udtrukket fra en database med mange billeder derfor SKAL det centreres.
Billed 2 skal så placeres helt til venstre (et banner) mens billed 1 skal placeres centreret.
Avatar billede saudoo Nybegynder
23. april 2011 - 21:53 #4
Okay.. Først og fremmest så lad være med at angive et afsnits højde og bredde. Brug DIV-elementer i stedet.

Positionsreglen foreskriver jo, at hvis du kan positionere absolut op imod en andet element, som selv er positioneret. Relative, fixed eller absolute spiller ingen rolle.

Jeg ville gøre noget ala. dette:


<div style="position: relative; width: 300px; height: 82px;">
<div style="text-align: center; height: 100%;">
  <img src="billed1.jpg">
</div>
<img style="position: absolute; top: 0px; left: 100px;" src="billed2.png">
</div>
Avatar billede Hans1 Praktikant
24. april 2011 - 09:31 #5
Tak for nyttigt information saudoo
Det fungere bare.

Smid svar :)
Avatar billede saudoo Nybegynder
24. april 2011 - 09:55 #6
Ingen årsag. Du skriver bare, hvis du har spørgsmål til mere. ;)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester