i Leute ich hab folgendes Problem bei dieser Galerie:
Stu Nicholls | CSSplay | A simple photograph gallery
Ich hab mir den Quelltext raus kopiert und auch bisschen umgeschrieben und
der sieht so aus:
Nur hab ich ein Problem die Bilder die er lädt, lädt er in dem Original maß.
Ich hab es schon so versucht:
indem ich width und height direkt reingeschrieben habe.
Aber ich glaube ich habe einen Denkfehler und man muss es im css definieren, weil so funktioniert es nicht :-)
Vielleicht kann mir einer helfen.
Danke Leute
Gruß
Stu Nicholls | CSSplay | A simple photograph gallery
Ich hab mir den Quelltext raus kopiert und auch bisschen umgeschrieben und
der sieht so aus:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> Stu Nicholls | CSSplay | A simple photograph gallery</title>
<meta name="Author" content="Stu Nicholls" />
<meta name="Keywords" content= "cssplay, css, play, Cascading, Style, Sheets, experiments, demonstrations, gallery, galleries, photo, albums, simple" />
<meta name="Description" content="CSS - Cutting edge Cascading Style Sheets. Experiments in CSS" />
<meta name="verify-v1" content="n3Dpx4NklZjg5p/Tq7h1q+Oj6Ml83crtkO/PwepVQ6Y=" />
<meta http-equiv="imagetoolbar" content="no" />
<link rel="meta" href="http://www.cssplay.co.uk/labels.rdf" type="application/rdf+xml" title="ICRA labels" />
<meta http-equiv="pics-Label" content='(pics-1.1 "http://www.icra.org/pics/vocabularyv03/" l gen true for "http://cssplay.co.uk" r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 0) gen true for "http://www.cssplay.co.uk" r (n 0 s 0 v 0 l 0 oa 0 ob 0 oc 0 od 0 oe 0 of 0 og 0 oh 0 c 0))' />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://www.cssplay.co.uk/feed.xml" />
<link rel="shortcut icon" href="http://www.cssplay.co.uk/favicon.ico" type="image/x-icon" />
<link rel="icon" href="../favicon.ico" type="image/ico" />
<style type="text/css">
@import url(http://www.google.com/cse/api/branding.css);
</style>
<link rel="stylesheet" media="all" type="text/css" href="http://www.cssplay.co.uk/css/default.css" />
<style type="text/css">
#info {position:relative; z-index:10;}
a, a:visited, a:hover, a:active {}
#gallery {width:750px; position:relative;}
#gallery .default {position:absolute; left:89px; top:53px; border:0px solid #888; z-index:-1;}
#gallery ul {list-style:none; padding:0; margin:0; width:180px; float:right;}
#gallery ul li {display:inline; width:60px; height:60px; float:left;}
#gallery ul li a {display:block; width:50px; height:50px; text-decoration:none; padding:4px; border:1px solid #fff;}
#gallery ul li a img {width:50px; height:50px; border:0;}
#gallery ul li a b {position:absolute; left:-9999px; display:block; width:570px; height:360px; background:#fff;}
#gallery ul li a:hover,
#gallery ul li a:active,
#gallery ul li a:focus {white-space:normal; outline:0;}
#gallery ul li a:hover b {position:absolute; left:0; top:5px; z-index:100;}
#gallery ul li a:active b,
#gallery ul li a:focus b {position:absolute; left:0; top:5px;}
#gallery ul li a b i {display:block; width:570px; height:360px; text-align:center; display:table-cell; vertical-align:middle;}
#gallery ul li a b i img {width:auto; height:auto; border:0px solid #888;}
</style>
<!--[if lte IE 7]>
<style type="text/css">
#gallery .default {top:55px;}
#gallery ul li a b {text-align:center; z-index:-1;}
#gallery ul li a b span {display:block; width:0; height:100%; display:inline-block; vertical-align:middle;}
#gallery ul li a b img {margin:0 auto; display:inline-block; vertical-align:middle;}
</style>
<![endif]-->
</head>
<body id="www-cssplay-co-uk">
<div id="info">
<p class="info"></p>
<div id="gallery">
<img class="default" src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" width="400" height="300">
<ul>
<li class="p1"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p2"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p3"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p4"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p5"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p6"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p7"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
<li class="p8"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /></i></b></a></li>
</ul>
</div>
<br class="clear" />
<br /><br /><br />
</div> <!-- end of info -->
</body>
</html>
Nur hab ich ein Problem die Bilder die er lädt, lädt er in dem Original maß.
Ich hab es schon so versucht:
HTML:
<li class="p8"><a href="#x"><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" /><b><span></span><i><img src="http://kultura-moebel-2.plenty-test.de/images/produkte/i11/117-2.jpg" alt="" width="400" height="300"/></i></b></a></li>
indem ich width und height direkt reingeschrieben habe.
Aber ich glaube ich habe einen Denkfehler und man muss es im css definieren, weil so funktioniert es nicht :-)
Vielleicht kann mir einer helfen.
Danke Leute
Gruß