Kom ihåg mig?
Home Menu

Menu

FAQ
Kalender
Forum FAQ

WN > Webbutveckling & webbhotell > Klientsidans teknologier, design och grafik

Fotogalleri i CSS

Visa första olästa Visa första olästa  
Ämnesverktyg Visningsalternativ
Oläst 2006-09-28, 13:18 #1
Happy Helmet Happy Helmet är inte uppkopplad
Nykomling
  
Reg.datum: Sep 2006
Inlägg: 8
Happy Helmet Happy Helmet är inte uppkopplad
Nykomling
 
Reg.datum: Sep 2006
Inlägg: 8
[font=Geneva]Jag har använt galleriet Photo Gallery Mk. IIfrån http://www.cssplay.co.uk/menu/scroll_gallery.html, men har lite problem med det. Det funkar bara nästan i IE6 när jag tar bort "Transitional" och börjar koden med <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN">. Då visas däremot inte tabelcellerna i rätt storlek. I Firefox funkar cellerna, men där där toppjusteras de stora bilderna inte.
Printscreens på hur det ser ut i IE respektive Firefox är bifogat.

Vet någon hur man kan lösa detta?


Den aktuella sidan:

Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN">
<html>
<link href="../css/default.css" rel="stylesheet" type="text/css">
<head>
<title>Unika M&ouml;bler | Sortiment</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
 if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
  document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
 else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
</script>
<STYLE type=text/css>
#holder {Z-INDEX: 1; MARGIN-BOTTOM: 0px; POSITION: relative}
#scrollbox {BORDER-RIGHT: none; BORDER-TOP: none; BACKGROUND: #111111; MARGIN-LEFT: 0px; OVERFLOW: auto; BORDER-LEFT: none; WIDTH: 600px; BORDER-BOTTOM: none; HEIGHT: 90px}
A.gallery {BORDER-RIGHT: none; BORDER-TOP: none; DISPLAY: block; FLOAT: left; MARGIN: 0px; BORDER-LEFT: none; WIDTH: 109px; COLOR: #111111; BORDER-BOTTOM: none; HEIGHT: 70px; TEXT-DECORATION: none}
A.gallery:visited {BORDER-RIGHT: none; BORDER-TOP: none; DISPLAY: block; FLOAT: left; MARGIN: 0px; BORDER-LEFT: none; WIDTH: 109px; COLOR: #111111; BORDER-BOTTOM: none; HEIGHT: 70px; TEXT-DECORATION: none}
A.slide001 {BACKGROUND: url(../images/assortment/thumbnails/miljobild_1.jpg)}
A.slide002 {BACKGROUND: url(../images/assortment/thumbnails/miljobild_2.jpg)}
A.slide003 {BACKGROUND: url(../images/assortment/thumbnails/miljobild_3.jpg)}
A.slide004 {BACKGROUND: url(../images/assortment/thumbnails/miljobild_4.jpg)}

A.gallery SPAN {DISPLAY: block; Z-INDEX: 100; BACKGROUND: none; LEFT: 0px; OVERFLOW: hidden; WIDTH: 1px; POSITION: absolute; TOP: -1px; HEIGHT: 1px}
A.gallery:hover {BORDER-RIGHT: none; BORDER-TOP: none; BORDER-LEFT: none; BORDER-BOTTOM: none; WHITE-SPACE: normal}
A.gallery:hover IMG {BORDER-RIGHT: none; BORDER-TOP: none; Z-INDEX: 100; BORDER-LEFT: none; BORDER-BOTTOM: none}
A.gallery:active IMG {BORDER-RIGHT: none; BORDER-TOP: none; Z-INDEX: 50; BORDER-LEFT: none; BORDER-BOTTOM: none}
A.gallery:unknown IMG {BORDER-RIGHT: none; BORDER-TOP: none; Z-INDEX: 50; BORDER-LEFT: none; BORDER-BOTTOM: none}
A.gallery:hover SPAN {PADDING-RIGHT: none; DISPLAY: block; PADDING-LEFT: none; FONT-SIZE: 11px; Z-INDEX: 100; BACKGROUND: none; LEFT: 0px; PADDING-BOTTOM: none; WIDTH: 600px; COLOR: #111111; PADDING-TOP: none; FONT-STYLE: none; POSITION: absolute; TOP: 0px; HEIGHT: 418px}
A.gallery:active {BORDER-RIGHT: none; BORDER-TOP: none; BORDER-LEFT: none; BORDER-BOTTOM: none}
A.gallery:active SPAN {PADDING-RIGHT: none; DISPLAY: block; PADDING-LEFT: none; Z-INDEX: 50; BACKGROUND: none; LEFT: 0px; PADDING-BOTTOM: none; WIDTH: 600px; COLOR: #111111; PADDING-TOP: none; FONT-STYLE: none; POSITION: absolute; TOP: 0px; HEIGHT: 418px}
A.gallery:unknown SPAN {PADDING-RIGHT: none; DISPLAY: block; PADDING-LEFT: none; Z-INDEX: 50; BACKGROUND: none; LEFT: 0px; PADDING-BOTTOM: none; WIDTH: 600px; COLOR: #111111; PADDING-TOP: none; FONT-STYLE: none; POSITION: absolute; TOP: 0px; HEIGHT: 418px}#thumbs {WIDTH: 1500px; HEIGHT: 70px}

#pad {WIDTH: 0px; HEIGHT: 418px}

</STYLE>

</head>

<body>
<div id="Layer1" style="position:absolute; z-index:1">
 <table width="100%" height="582" border="0" cellpadding="5" cellspacing="0">
  <tr> 
   <td></td>
   <td width="268" height="550" rowspan="3" background="../images/lock_logo.jpg"></td>
   <td width="190" height="32" align="center" valign="middle" bgcolor="#333333"><a href="start.htm">START</a></td>
   <td width="190" height="32" align="center" valign="middle" bgcolor="#333333"><a href="about.htm">OM 
    OSS</a></td>
   <td width="190" height="32" align="center" valign="middle" bgcolor="#444444">SORTIMENT</td>
   <td></td>
  </tr>
  <tr> 
   <td height="132"></td>
   <td width="590" height="518" colspan="3" rowspan="2"> 
    <p class="largertext"></p></td>
   <td></td>
  </tr>
  <tr> 
   <td height="386"></td></td>
   <td></td>
  </tr>
  <tr> 
   <td></td>
   <td height="32"></td>
   <td height="32" colspan="3" align="right" valign="middle">M&Aring;NDAG-FREDAG 
    11-18, L&Ouml;RDAG 11-15, S&Ouml;NDAG 12-16<br>
    Argongatan 8, 431 53 M&ouml;lndal | <a href="http://www.hitta.se/pink/XkaCscNHh9Y9FydNXkouuw==.aspx" target="_top">Karta</a> 
    | 031-87 70 90 | <a href="mailto:[email protected]">[email protected]</a></td>
   <td></td>
  </tr>
 </table>
</div>
<div id="Layer2" style="position:absolute; left:0px; top:42px; width:100%; height:518px; z-index:2"> 
 <table width="100%" height="386" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
   <td></td>
   <td width="278" height="386"></td>
   <td width="600" height="386">
<DIV id=holder> 
    <DIV id=pad></DIV>
    <DIV id=scrollbox> 
     <DIV class="largertext" id=thumbs></p><A class="gallery slide001" href="../../images/assortment/miljobild_1.jpg#nogo"><SPAN><IMG src="../images/assortment/miljobild_1.jpg" width="600" height="386"><BR>
      Information om produkten<BR>
      0:-</SPAN></A> <A class="gallery slide002" href="../../images/assortment/miljobild_2.jpg#nogo"><SPAN><IMG src="../images/assortment/miljobild_2.jpg" width="600" height="386"><BR>
      Information om produkten<BR>
      0:-</SPAN></A> <A class="gallery slide003" href="../../images/assortment/miljobild_3.jpg#nogo"><SPAN><IMG src="../images/assortment/miljobild_3.jpg" width="600" height="386"><BR>
      Information om produkten<BR>
      0:-</SPAN></A> <A class="gallery slide004" href="../../images/assortment/miljobild_4.jpg#nogo"><SPAN><IMG src="../images/assortment/miljobild_4.jpg" width="600" height="386"><BR>
      Information om produkten<BR>
      0:-</SPAN></A></DIV>
    </DIV>
   </DIV>
 </DIV>
  
  </td>
   <td></td>
  </tr>
 </table>
</div>
</body>
</html>

Tillhörande CSS:

Kod:
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	background-color: #111111;
	background-image: url(../images/grey_background.jpg);

}
A:link {
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	font-weight: bold;
}
A:visited {
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	font-weight: bold;
}
A:hover {
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: underline;
	font-weight: bold;
}
td {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
}
div {
	height: 570px;
	width: 100%;
	left: 0px;
	top: 10px;
	right: 0px;

}
.largertext {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-align: left;
}
.largertextjustify {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	text-align: justify;
}
IE6:



Firefox:
</span>
Happy Helmet är inte uppkopplad   Svara med citatSvara med citat
Oläst 2006-09-28, 14:53 #2
Happy Helmet Happy Helmet är inte uppkopplad
Nykomling
  
Reg.datum: Sep 2006
Inlägg: 8
Happy Helmet Happy Helmet är inte uppkopplad
Nykomling
 
Reg.datum: Sep 2006
Inlägg: 8
Problemet löst.
Happy Helmet är inte uppkopplad   Svara med citatSvara med citat
Svara

« Föregående ämne | Nästa ämne »

Aktiva användare som för närvarande tittar på det här ämnet: 1 (0 medlemmar och 1 gäster)
 

Regler för att posta
Du får inte posta nya ämnen
Du får inte posta svar
Du får inte posta bifogade filer
Du får inte redigera dina inlägg
BB-kod är på
Smilies är på
[IMG]-kod är på
HTML-kod är av
Forumhopp


Alla tider är GMT +2. Klockan är nu 17:33.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson
 
WN Domännamn
Copyright © 2017