mellomrom mellom to bilder

[snowgirl87]

hei hvordan får jeg mellom rom mellom to bilder jeg skal ha på siden av hverandre i php?

[Vindstille]

Mener du i html?

Tror du kan bruke CSS og f.eks. margin:10px;

[snowgirl87]

Mener du i html?

Tror du kan bruke CSS og f.eks. margin:10px;

6203712[/snapback]

hum fikk ikke det til å funke, men er egentli det samme om det er i php eller html

[Vindstille]

I HTML

<img style="margin:10px;" src="http://www.domene.no/bilde1.jpg" alt="">
<img style="margin:10px;" src="http://www.domene.no/bilde2.jpg" alt="">
<img style="margin:10px;" src="http://www.domene.no/bilde3.jpg" alt="">

[snowgirl87]

hei hvordan får jeg mellom rom mellom to bilder jeg skal ha på siden av hverandre i php?

6203618[/snapback]

denne koden gjør så bildet flutter seg nedover (loddrett) jeg skal ha bildet til å flytte seg sidelengs mot høyre(vannrett). bilde1 ---------------- bilde 2

[Vindstille]

Slik:

<p>
<img alt="left" src="http://www.domene.no/bilde.jpg" alt="">
<img alt="right" src="http://www.domene.no/bilde.jpg" alt="">
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
masse tekst her<br>
</p> 

Om du vil ha med teksten eller ikke spiller ingen rolle.

[bosannes]

hei hvordan får jeg mellom rom mellom to bilder jeg skal ha på siden av hverandre i php?

6203618[/snapback]

Den grafiske utforminga i moderne nettsider skjer hovedsaklig ved hjelp av CSS, som en tillegsmodul til (x)html.

 

Php handler om å lage dynamiske funksjoner, skrive til eksterne datakilder o.l.

 

Her er koden du nok er ute etter:

 

<img src="http://www.domene.no/bilde.jpg" alt="" style="float: left;">
<img src="http://www.domene.no/bilde.jpg" alt="" style="float: left; margin-left: 10px;">

 

Problematisk er det at IE6 (mest brukte nettleser i verden) leser margin-left på float-elementer som dobbelt, og viser dermed et annet resultat enn skikkelige nettlesere.

 

Tror også dette skal funke:

 

<img src="http://www.domene.no/bilde.jpg" alt="" style="display: inline;">
<img src="http://www.domene.no/bilde.jpg" alt="" style="display: inline; margin-left: 10px;">

[Mapster]

Du har flere muligheter her, min anbefaling er at du setter bildene inn i en tabell og definerer bredden på cellene. Hvor x er en verdi som er større en bredden på bildet...

<table>
    <tr>
         <td width=x><img alt="left" src="http://www.domene.no/bilde.jpg" alt=""></td>
         <td width=x><img alt="left" src="http://www.domene.no/bilde.jpg" alt=""></td>
    </tr>
</table>

 

Du kan også bruke denne metoden:

     <img alt="left" src="http://www.domene.no/bilde.jpg" alt=""> &npsp;
    <img alt="left" src="http://www.domene.no/bilde.jpg" alt="">&nbps; 

Hvor antall "&nbpsp;" er antall mellomrom du vil ha.

[bosannes]

Om du sier at lilleviseren på klokka står i 90 grader og storeviseren står i 180 grader, vil jeg forstå hva klokka er, men for ordens skyld har vi et eget system for å definere tid.

 

MapSters forslag vil kunne gi deg det du er ute etter, men verken tabeller eller nobrakespacers er ment å brukes til design. Design bruker man css-stil til...

Endret 30. mai 2006 av bosannes

[aeinstein]

Hva skal han med all den tullete koden dere har der.....

<img src="http://www.domene.no/bilde.jpg" alt="" style="margin: 0 10px 0 0;">
<img src="http://www.domene.no/bilde.jpg" alt="">

Dette er nok til å få ti piksler mellom dem.

[bosannes]

Hva skal han med all den tullete koden dere har der.....

<img src="http://www.domene.no/bilde.jpg" alt="" style="margin: 0 10px 0 0;">
<img src="http://www.domene.no/bilde.jpg" alt="">

Dette er nok til å få ti piksler mellom dem.

6214838[/snapback]

IMG har clear: both som standard da...

[endrebjo]

Hva skal han med all den tullete koden dere har der.....

<img src="http://www.domene.no/bilde.jpg" alt="" style="margin: 0 10px 0 0;">
<img src="http://www.domene.no/bilde.jpg" alt="">

Dette er nok til å få ti piksler mellom dem.

6214838[/snapback]

IMG har clear: both som standard da...

6243960[/snapback]

Nei. img er display: inline; som default.

I følgende kode står bildene ved siden av hverandre:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
 <title>img-test</title>
 <style type="text/css">
 * {
 	padding: 0;
 	margin: 0;
 }
 img {
 	border: solid 1px #000;
 }
 </style>
</head>

<body>
 <img src="#" alt="bilde1">
 <img src="#" alt="bilde2">
</body>
</html>

For å få avstand mellom bildene, legger du til margin-right: 10px; i CSS-delen.

Endret 5. juni 2006 av endrebjorsvik