Det här borde funka alldeles utmärkt:
div.picframe {
padding: 5px;
border: 1px solid grey;
float: right; /* beroende på vart du vill placera bilden */
}
<div class="picframe"><img src="test.jpg"></div>
HTML & CSSur HTML, XHTML & CSS
9 svar · 294 visningar · startad av bwcMikke
Jag skall ha en ram som ligger 5px utanför en bild. Detta har jag löst genom att göra en tabellcell och sätta cellpadding=5.
Se http://www.formany.se/about.asp
Nu vill jag på några sidor lösa detta utan tabeller. Jag har försökt med ex.
<div class="picframe"><img src="test.jpg"></div>
men detta fungerar inte.
Bilderna är inte med 100% säkerhet lika stora.
Några tips?
Tack på förhand
/Mikke
Det här borde funka alldeles utmärkt:
div.picframe {
padding: 5px;
border: 1px solid grey;
float: right; /* beroende på vart du vill placera bilden */
}
<div class="picframe"><img src="test.jpg"></div>
Lysande!!
Jag fick lägga till
width: 10px;
för annars tog ramen upp hela sidbredden. Av någon anledning fick jag också ta ner från 5 till 2 px för att marginalen skulle bli likadan som på de andra bilderna. Skumt
Tack än en gång!
För att vara riktigt petig så ska ma enligt W3C skriva antingen
[red]
div.picframe {
padding: 5px;
border: 1px solid [b]gray[/b]; /* eller #808080 */
float: right; /* beroende på vart du vill placera bilden */
}
[/red]
http://www.w3.org/TR/CSS21/syndata.html#color-units
mv icaaq
img.test { padding: 5px; border: 1px solid gray; }
Sätt det på bilden direkt
img {
padding:5px;
border:1px solid black;
}
Funkar i standardsläge i IE6 också - däremot inte i quirksläget
/ m a r t i n
Som sagt (zcorpan hann före) ;-)
Nja, det funkar inte att sätta det direkt på img-taggen.
Förvisso blir det en ram men paddingen fungerar inte. Ramen kommer direkt på bilden.
Gör jag något fel?
/Mikke
Se till att få IE i "standards mode" genom att lägga rätt DOCTYPE högst upp, och ingenting före den. Tex:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
Det här inlägget finns inte och har aldrig funnits! För Zcorpan hann före!