галерия чупи под ие

zareva_rositsa · 7 Октомври 2010

Здравейте,

написах си следната галерия:

http://twinkle.uphero.com/Deni/index-3.html
, но под ие ми казаха, че чупи. От снимката на счупенто излиза, че елемента, който съдържа тъмбнейлчетата се показва в цялата си ширина, сякаш не съм я фиксирала или няма overflow: hidden;. Като го гледам при мен не чупи и затова искам да випомоля да ми кажете нормално ли се вижда при вас, и ако не, знаете ли какво мога да направя, за да го оправя?

Поздрави,
Росица

teroristd · 7 Октомври 2010

че чупи е вярно но най добре пусни някакъв код да се гледа че иначе никой няма да ти отговори

zareva_rositsa · 7 Октомври 2010

Ми той е много и затова го "спестих", да го разкажа накратко:
1. Див-а, който съдържа големите картинки е с id="main"
2. Двата слайдера с тъмбнейлчетата в дясно са направени с ul, който има overflow: none; (то такава декларация няма официално, дали не е от това

). Горния слайдер ul - а е в див с id="th", който има фиксирана ширина, височина, position: relative; и "white-space: nowrap;", за да не слизат на втори ред li - тата, като не им стига място. Този див е в още един див с id="th_hold", position: relative; overflow: hidden;. За долния слайдер нещата се повтарят, като само променям имената на id - тата. Лошото е,че като при мен всичко се вижда добре, не мога да тествам.

Код HTML:

Код:

<BODY BGCOLOR=#FFFFFF LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 >
<TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0 align="center">
	<TR><td width="50%" background="images/bg1.jpg" style="background-position:top right "><img src="images/spacer.gif" width="1" height="1"></td>
		<TD><IMG SRC="images/top.jpg" WIDTH=766 HEIGHT=87 ALT=""></TD>
		<td width="50%" background="images/bg1.jpg" style="background-position:top left "><img src="images/spacer.gif" width="1" height="1"></td>
	</TR>
	<TR><td width="50%" height="100%" background="images/bg3.jpg">
	<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
  <tr><td valign="top" height="100%" background="images/bg2.jpg" style="background-position:top right; background-repeat:repeat-x "><img src="images/spacer.gif" height="333" width="1"></td></tr></table></td>
		<TD WIDTH=766 HEIGHT=333 ALT="" valign="top">
		<TABLE WIDTH=766 BORDER=0 CELLPADDING=0 CELLSPACING=0>
	<TR>
		<TD valign="top" background="images/left1.jpg"><IMG SRC="images/left.jpg" WIDTH=38 HEIGHT=333 ALT=""></TD>
		<TD WIDTH=694 HEIGHT=333 ALT="" valign="top">
		<table width="694" border="0" cellspacing="0" cellpadding="1" bgcolor="#FADFB6">
  <tr>
    <td valign="top">
	<TABLE WIDTH=692 BORDER=0 CELLPADDING=0 CELLSPACING=0 style="overflow: hidden;">
	<TR>
		<TD valign="top" >
	
	<div id="main">
		<div id="p1"><IMG SRC="images/g1.jpg" WIDTH=297 HEIGHT=331 ALT="">
		</div >
		<div id="p2" ><IMG SRC="images/g2.jpg" ALT="" style="margin-top: 55px;">
		</div >
		<div id="p3" ><IMG SRC="images/g3.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p4" ><IMG SRC="images/g4.jpg" ALT="" style="margin-top: 55px;">
		</div >
		<div id="p5" ><IMG SRC="images/g5.jpg" ALT="" style="margin-left: 25px;">
		</div >
		<div id="p6"><IMG SRC="images/g6.jpg" ALT="" style="margin-top: 55px;">
		</div >
		<div id="p7" ><IMG SRC="images/g7.jpg" ALT="" style="margin-top: 55px;">
		</div >
		<div id="p8" ><IMG SRC="images/g8.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p9"  ><IMG SRC="images/g9.jpg" ALT="" style="margin-top: 55px;">
		</div >
		<div id="p10" ><IMG SRC="images/g10.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p11" ><IMG SRC="images/g11.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p12" ><IMG SRC="images/g12.jpg"  ALT="" style="margin-left: 25px;">
		</div >
		<div id="p13" ><IMG SRC="images/g13.jpg"  ALT="" style="margin-left: 25px;">
		</div >
		<div id="p14" ><IMG SRC="images/g14.jpg"  ALT="" style="margin-left: 25px;">
		</div >
		<div id="p15" ><IMG SRC="images/g15.jpg"  ALT="" style="margin-left: 25px;">
		</div >
		<div id="p16" ><IMG SRC="images/g16.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p17" ><IMG SRC="images/g17.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p18" ><IMG SRC="images/g18.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p19" ><IMG SRC="images/g19.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p20" ><IMG SRC="images/g20.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p21" ><IMG SRC="images/g21.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p22" ><IMG SRC="images/g22.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p23" ><IMG SRC="images/g23.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p24" ><IMG SRC="images/g24.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p25" ><IMG SRC="images/g25.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p26" ><IMG SRC="images/g26.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p27" ><IMG SRC="images/g27.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p28" ><IMG SRC="images/g28.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		<div id="p29" ><IMG SRC="images/g29.jpg"  ALT="" style="margin-top: 55px;">
		</div >
		</div >
		
	
	
		</TD>
		<TD bgcolor="#BB8F4D"><IMG SRC="images/spacer.gif" WIDTH=1 HEIGHT=331 ALT=""></TD>
		<TD WIDTH=377 HEIGHT=331 ALT="" valign="top" style="padding-bottom:0px; overflow: hidden ">
		<div><table width="377" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td valign="top" style="padding-bottom:22px; padding-top:15px; background-position:bottom; background-repeat:repeat-x " bgcolor="#F6D6AC" background="images/px.gif" >	
	<div style="margin-left:25px; margin-right:25px ">
<img src="images/2txt1.gif" ><br>
<br style="line-height:6px ">
<img src="images/px1.gif" width="324" height="1"><br>
<br style="line-height:20px ">
<div id="th_hold">
<div id="th">
<ul>
<li><a href="#nogo"><img src="images/1_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/2_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/3_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/4_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/5_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/6_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/7_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/8_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/9_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/10_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/11_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/12_th.jpg" border="0" style="margin-right:3px " ></a></li>
</ul>

</div>
</div>


<div id="th_hold1">
<div id="th1">
<ul>
<li><a href="#nogo"><img src="images/12_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/13_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/14_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/15_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/16_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/17_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/18_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/19_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/20_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/21_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/22_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/23_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/24_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/25_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/26_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/27_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/28_th.jpg" border="0" style="margin-right:3px " ></a></li>
<li><a href="#nogo"><img src="images/29_th.jpg" border="0" style="margin-right:3px " ></a></li>
</ul>
</div>
</div>
</div>
	</td>
  </tr>
</table>
</div>
<br style="line-height:12px "><div style="margin-left:25px; margin-right:25px ">
<img src="images/2txt2.gif" width="110" height="9"><br>
<br style="line-height:6px ">
<img src="images/px2.gif" width="324" height="1"><br>


<br>

<div id="container_hold">
<div id="container">
<span ><img src="images/spacer.gif" width="7" height="1">[<a href="#" >1</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">2</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">3</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">4</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">5</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">6</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">7</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">8</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">9</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">10</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">11</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">12</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">13</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">14</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">15</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">16</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">17</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">18</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">19</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">20</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">21</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">22</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">23</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">24</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">25</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">26</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">27</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">28</a>]</span>
<span ><img src="images/spacer.gif" width="3" height="1">[<a href="#">29</a>]</span>
</div>
</div>
<div id="right"><img src="images/spacer.gif" width="7" height="1"><a href="#">следващи</a></div>


</div>
		</TD>
		<TD WIDTH=17 HEIGHT=331 ALT="" valign="top" background="images/right_bg.gif"><img src="images/x.gif" width="17" height="19"></TD>
	</TR>
</TABLE>
	</td>
  </tr>
</table>

		</TD>
		<TD valign="top" background="images/right1.jpg"><IMG SRC="images/right.jpg" WIDTH=34 HEIGHT=333 ALT=""></TD>
	</TR>
</TABLE>
		</TD>
		<td width="50%" height="100%" background="images/bg3.jpg">
	<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
  <tr><td valign="top" height="100%" background="images/bg2.jpg" style="background-position:top left; background-repeat:repeat-x "><img src="images/spacer.gif" height="333" width="1"></td></tr></table></td>
	</TR>
	<TR><td width="50%" background="images/bg4.jpg" style="background-position:top right "><img src="images/spacer.gif" width="1" height="1"></td>
		<TD WIDTH=766 HEIGHT=102 ALT="" valign="top">
		<TABLE WIDTH=766 BORDER=0 CELLPADDING=0 CELLSPACING=0 id="menu">
	<TR>
		<TD><a href="index.html"><IMG SRC="images/logo.jpg" WIDTH=336 HEIGHT=102 ALT="" border="0"></a></TD>
		<TD ><a href="index-1.html" ><img src="images/m1.jpg" name="Image20" width="95" height="102" border="0"></a></TD>
		<TD ><a href="index-2.html" ><img src="images/m2.jpg" name="Image21" width="96" height="102" border="0"></a></TD>
		<TD ><a href="index-3.html" ><img src="images/m3.jpg" name="Image22" width="96" height="102" border="0"></a></TD>
		<TD ><a href="index-4.html" ><img src="images/m4.jpg" name="Image23" width="90" height="102" border="0"></a></TD>
		<TD><IMG SRC="images/bot_right.jpg" WIDTH=53 HEIGHT=102 ALT=""></TD>
	</TR>
</TABLE>
		</TD>
		<td width="50%" background="images/bg4.jpg" style="background-position:top left "><img src="images/spacer.gif" width="1" height="1"></td>
	</TR>
	<TR><td width="50%" background="images/bg5.jpg" style="background-position:top right "><img src="images/spacer.gif" width="1" height="1"></td>
		<TD background="images/bottom.jpg" WIDTH=766 HEIGHT=105 ALT="" valign="top" style="padding-top:6px ">
		<div align="right" style="margin-right:25px ">
		
		
  <iframe src="http://pointbg.net/poweredby/usemap_catalogbg.html" 
  allowtransparency="true" width="145" height="24" frameborder="0" scrolling="no">
  <p>You need a Frames Capable browser to view this content.</p>
  </iframe>
  

		
		
		</div>
		</TD>
		<td width="50%" background="images/bg5.jpg" style="background-position:top left "><img src="images/spacer.gif" width="1" height="1"></td>
	</TR>
</TABLE>
</BODY>

Код css:

Код:

#main {height:331px; width:297px;margin: 0px; padding: 0px; }
#main div {width: 297px; height:331px;  position:absolute; z-index: 0;margin: 0px; padding: 0px; background-color: #fadfb6;}
#main div.current{z-index: 3; background-color: #fadfb6;}
#th_hold{margin: 0px 0 0px 0; padding: 0px; width: 327; height: 90px; position: relative; overflow: hidden;}
#th_hold1{margin: 0px 0 0px 0; padding: 0px; width: 327; height: 90px; position: relative; overflow: hidden;}
#th{margin: 0px 0 7px 0; padding: 0px; width: 327; height: 90px; position: relative; white-space: nowrap;}
#th ul{padding: 0; margin:0; list-style-type: none; overflow: none; }
#th li{padding: 0; margin:0 ; display: inline; }
#th li img{padding: 0; margin:0 3px 0 0; border: 2px solid #786142; }
#th1{margin: 0px 0 7px 0; padding: 0px; width: 327; height: 90px; position: relative; white-space: nowrap;}
#th1 ul{padding: 0; margin:0; list-style-type: none; overflow: none; }
#th1 li{padding: 0; margin:0 ; display: inline; }
#th1 li img{padding: 0; margin:0 3px 0 0; border: 2px solid #786142; }
#container_hold{width: 63%; height: 20px; float: left; position: relative; overflow: hidden;}
#container{width: 230px; height: 20px;position: relative; white-space: nowrap;}
#right{padding: 0 0 0 8px; width: 15%; float: left;}
#left{width: 15%; float: left;}

zareva_rositsa · 7 Октомври 2010

http://twinkle.uphero.com/Deni/index-3.html

Промених му малко кода, ще съм благодарна на всеки, който каже дали чупи при него

Поздрави,

Admin · 8 Октомври 2010

Под IE6,7, 8 е добре.
Изтегли си безплатният тестов браузер IE tester.
Така ще може да виждаш как изглежда сайта ти под различните версии на Internet explorer.
Разликите са доста големи обикновено но твоя сайт се вижда добре под всякакви в момента.

teroristd · 8 Октомври 2010

вчера чупеше при мене под ие8 днеска не чупи браво но както казва admin най добре си свали ие тестер

zareva_rositsa · 9 Октомври 2010

а как се сваля ие тестер

? - намерих го, благодаря за съвета, безценен :?:

галерия чупи под ие

zareva_rositsa

Registered

teroristd

Registered

zareva_rositsa

Registered

zareva_rositsa

Registered

Admin

Registered

teroristd

Registered

zareva_rositsa

Registered