Witam serdecznie kolegów i koleżanki.
Chciałbym prosić Was o pomoc z "przesunięciem" galerii na odpowiednie miejsce.
Nie jestem programistą i niestety nie umiem sobie poradzić z tą kosmetyczna zmianą
Bardzo proszę o Waszą pomoc.
Temat dotyczy adresu:http://www.lekkerland.strefa.pl/warszawa/1245/300/florystyka_slubna_bukiety.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>PROJEKT 017/11</title>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="index.css" media="all"/>
</head>
<body>
<div id="container">
<div id="content">
<div style="width: 1016px; height: 122px;">
<!--<div class="logo">
</div>-->
<div id="menu">
<a href="index.html"><img src="grafika/menu_kwiaciarnia_active.png" border="0"></a>
<a href="oferta_glowna.html"><img src="grafika/menu_oferta.png" border="0"></a>
<a href=""><img src="grafika/menu_facebook.png" border="0"></a>
<a href="kontakt.html"><img src="grafika/menu_kontakt.png" border="0"></a>
</div>
<div id="menu_pion">
<ul>
<li><a href="oferta_slubna.html"><img src="grafika/rbutton1.png" border="0"></a></li><br />
<li><a href="oferta_okolicznosciowa.html"><img src="grafika/rbutton2.png" border="0"></a></li><br />
<li><a href="oferta_zalobna.html"><img src="grafika/rbutton3.png" border="0"></a></li><br />
<li><a href="oferta_swiateczna.html"><img src="grafika/rbutton4.png" border="0"></a></li><br />
<li><a href="oferta_dlafirm.html"><img src="grafika/rbutton5.png" border="0"></a></li>
</ul>
</div>
<div id="menu_pion2">
<ul>
<li><a href="florystyka_slubna_bukiety.html"><img src="grafika/rbutton11.png" border="0"></a></li><br />
<li><a href="florystyka_slubna_samochod.html"><img src="grafika/rbutton12.png" border="0"></a></li><br />
<li><a href="florystyka_slubna_kosciol.html"><img src="grafika/rbutton13.png" border="0"></a></li><br />
<li><a href="florystyka_slubna_sala.html"><img src="grafika/rbutton14.png" border="0"></a></li><br />
</ul>
</div>
</div>
<div class="tresc">
<div class="tresc2">
<div style="background-image: url('grafika/tlo_flor_slub.jpg'); width: 843px; height: 552px;">
<div style="height: 30px;"></div>
<div style="width: 843px; height: 520px; font-family: Georgia,Sans,Verdana,Arial,Heveltica; font-size: 16px; color: rgb(255, 255, 255);" id="galeria">
<div style="overflow: auto; height: 520px; width: 790px;">
<div style="float: left; padding-left: 50px; padding-top: 0px; width: 220px; line-height: 24px; text-shadow: 1px 1px 0px rgb(0, 0, 0);">
<a href="images/florystyka_slubna_bukiety/001.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m001.jpg" alt="" border="0" height="140" width="210"></a><br><br>
<a href="images/florystyka_slubna_bukiety/007.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m007.jpg" alt="" border="0" height="140" width="210"></a><br><br>
<a href="images/florystyka_slubna_bukiety/004.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m004.jpg" alt="" border="0" height="140" width="210"></a><br><br>
</div>
<div style="float: left; padding-left: 20px; padding-top: 0px; width: 220px; line-height: 24px; text-shadow: 1px 1px 0px rgb(0, 0, 0);">
<a href="images/florystyka_slubna_bukiety/002.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m002.jpg" alt="" border="0" height="140" width="210"></a><br><br>
<a href="images/florystyka_slubna_bukiety/008.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m008.jpg" alt="" border="0" height="140" width="210"></a><br><br>
<a href="images/florystyka_slubna_bukiety/005.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m005.jpg" alt="" border="0" height="210" width="140"></a><br><br>
</div>
<div style="float: left; padding-left: 20px; padding-top: 0px; width: 220px; line-height: 24px; text-shadow: 1px 1px 0px rgb(0, 0, 0);">
<a href="images/florystyka_slubna_bukiety/003.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m003.jpg" alt="" border="0" height="140" width="210"></a><br><br>
<a href="images/florystyka_slubna_bukiety/009.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m009.jpg" alt="" border="0" height="140" width="210"></a><br><br>
<a href="images/florystyka_slubna_bukiety/006.jpg" rel="lightbox[roadtrip]" title="001"><img src="florystyka_slubna_bukiety_mini/m006.jpg" alt="" border="0" height="210" width="140"></a><br><br>
</div>
</div>
</div>
</div>
</div>
<div class="stopka">
<br />
</div>
</div>
</div>
</div>
</body>
</html>
[/syntax]
Kod CSS witryny:
[syntax=css]
body { text-align: center; margin: 0px; padding: 0px; background-image: url('grafika/tlo4.jpg'); }
#container { border: 0px solid; width: 1016px; text-align: left; margin: 0pt auto; }
#content { width: 1016px; }
#menu { position: relative; z-index: 1; float: right; text-align: right; width: 1016px; height: 30px; margin-left: 20px; margin-top: 28px; margin-right: 100px; color: rgb(255, 255, 255); }
#menu a { position: relative; z-index: 1; top: 0px; }
#menu a:hover { position: relative; z-index: 1; top: -10px; }
A { color: rgb(255, 255, 255); font-weight: normal; }
A:link { color: rgb(255, 255, 255); text-decoration: none; }
A:visited { color: rgb(255, 255, 255); text-decoration: none; }
A:hover { color: rgb(255, 255, 255); text-decoration: underline; }
.logo { width: 170px; height: 108px; position: absolute; top: 14px; margin-left: 40px; margin-top: 10px; }
.tresc { position: relative; z-index: 10; width: 1016px; height: 681px; background-image: url('grafika/papier_tlo.png'); }
.tresc2 { padding-top: 48px; padding-left: 84px; }
.stopka { color: rgb(255, 255, 255); line-height: 18px; padding-top: 44px; padding-left: 680px; font-family: Georgia,Sans,Verdana,Arial,Heveltica; font-size: 14px; text-shadow: 1px 1px 0px rgb(0, 0, 0); }
.stopka A { color: rgb(255, 255, 255); padding-left: 8px; padding-right: 8px; font-weight: normal; }
.stopka A:link { color: rgb(255, 255, 255); text-decoration: none; }
.stopka A:visited { color: rgb(255, 255, 255); text-decoration: none; }
.stopka A:hover { color: rgb(255, 255, 255); text-decoration: underline; }
.stopka u { color: rgb(214, 0, 0); text-decoration: none; }
#galeria A:link img { padding: 1px; border: 3px solid rgb(241, 241, 241); opacity: 0.96; }
#galeria A:visited img { padding: 1px; border: 3px solid rgb(241, 241, 241); opacity: 0.96; }
#galeria A:hover img { padding: 1px; border: 3px solid rgb(182, 177, 173); opacity: 0.99; }
#menu_pion {
position: relative;
float: left;
width: 100%;
margin-left: -160px;
margin-top: 100px;
margin-right: 0px;}
#menu_pion2 {
position: relative;
float: left;
width: 100px;
margin-left: 950px;
margin-top: -530px;
margin-right: 0px;}
[/syntax]
Oraz kod CSS galerii
[syntax=css]#lightbox{ position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }
#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 100px; }
#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100% ; }
#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; outline: none;}
#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
