Pozdravljeni.
Pri izdelavi spletne strani (html/css) sem naletel na problem, ki ga ne znam rešiti. Kadar spletno stran zoomiram (+ ali -), se mi na povsem naključnih % (120, 85, 145,..) zgodi, da ozadje strani prekrije tanka bela črta. Nisem prepričan, zakaj se to dogaja, ampak verjamem da bo kdo izmed vas vedel za problem in pomagal pri rešitvi :)
.CSS koda
body {
background-color: #A6BBDD;
}
#wrapper {
width: 800px;
position: relative;
margin: auto;
background: white;
}
#crta_levo {
background: url('/design/line.gif') repeat-x;
height: 2px;
width: 673px;
float: left;
margin-top: 10px;
margin-left: 1px;
visibility: visible;
}
#button_top {
float: left;
}
#crta_desno {
background: url('/design/line.gif') repeat-x;
height: 2px;
width: 77px;
float: left;
margin-top: 10px;
visibility: visible;
}
#header {
background: url('/design/meni_bg.gif') no-repeat bottom;
height: 320px;
visibility: visible;
}
#meni a {
background: url('/design/button.gif') no-repeat;
display: block;
width: 105px;
height: 33px;
padding-top: 6px;
text-decoration: none;
text-align: center;
color: white;
font-weight: bolder;
font-size: 15px;
float: left;
position: relative;
visibility: visible;
}
#meni a.opened {
background: url('/design/button_active.gif') no-repeat;
visibility: visible;
}
#meni a:hover {
background: url('/design/button_active.gif') no-repeat;
visibility: visible;
}
#logo {
width: 91px;
height: 90px;
margin-left: 660px;
margin-top: 30px;
float: left;
position: absolute;
}
#animacija {
float: left;
width: 630px;
margin-top: 20px;
position: absolute;
}
#content {
background: #245194;
min-height: 350px;
height: auto;
color: white;
padding: 10px;
}
HTML koda
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Naslov</title>
<meta name="keywords" content="ključne besede">
<meta name="description" content="Opis spletne strani">
<link rel="stylesheet" type="text/css" href="design/style.css" />
<script language="JavaScript1.1" type="application/javascript">
<!--
//Pixelating Image slideshow
//Copyright Dynamic Drive 2001
//Visit http://www.dynamicdrive.com for this script
//specify interval between slide (in mili seconds)
var slidespeed = 10000
//specify images
var slideimages = new Array("design/animacija/slika1.png", "design/animacija/slika2.png", "design/animacija/slika3.png", "design/animacija/slika4.png", "design/animacija/slika5.png", "design/animacija/slika6.png")
//specify corresponding links
var slidelinks = new Array("")
var imageholder = new Array()
var ie55 = window.createPopup
for (i = 0; i < slideimages.length; i++) {
imageholder*= new Image()
imageholder*.src = slideimages*}
function gotoshow(){
window.location = slidelinks[whichlink]
}
//-->
</script>
</head>
<body>
<div id="wrapper">
<div id="crta_levo"></div>
<div id="button_top">
<a href="index.html"><img src="/design/home.png" border="0" alt="" /></a>
<a href="kontakt.html"><img src="/design/mail.png" border="0" alt="" /></a>
</div>
<div id="crta_desno"></div>
<div id="animacija">
<img src="design/animacija/slika1.png" name="slide" alt="" border=0 width="630" height="246">
<script language="JavaScript1.1" type="application/javascript">
<!--
var whichlink=0
var whichimage=0
var pixeldelay=(ie55)? document.images.slide.filters[0].duration*1000 : 0
function slideit(){
if (!document.images) return
if (ie55) document.images.slide.filters[0].apply()
document.images.slide.src=imageholder[whichimage].src
if (ie55) document.images.slide.filters[0].play()
whichlink=whichimage
whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
setTimeout("slideit()",slidespeed+pixeldelay)
}
slideit()
//-->
</script>
</div>
<div id="logo">
<a href="index.html"><img src="design/logotip.png" border="0" alt="" /></a>
</div>
<div id="header">
<div id="meni">
<a style="margin: 250px 0 0 25px;" href="podjetje.html">PODJETJE</a>
<a style="margin: 250px 0 0 25px;" href="dejavnost.html">DEJAVNOST</a>
<a style="margin: 235px 0 0 25px;" href="kontakt.html">KONTAKT</a>
<a style="margin: 216px 0 0 25px; font-size: 12px; padding-top: 8px;" href="strokovnjaki.html">STROKOVNJAKI</a>
<a style="margin: 185px 0 0 25px;" href="reference.html">REFERENCE</a>
<a style="margin: 150px 0 0 25px;" href="vizitka.html">VIZITKA</a>
</div>
</div>
<div id="content">
<font face="Arial"><b><center>vsebina</center></b>
</font>
</div>
</div>
</body>
</html>***
***Screenshots:
60 % zoom
http://i46.tinypic.com/2im6ck4.jpg
85 % zoom
http://i45.tinypic.com/112cz1f.jpg
120 % zoom
http://i47.tinypic.com/2z71vew.jpg
145 % zoom
http://i46.tinypic.com/r8xs0n.jpg
Gre mogoče za kako matematično zadevo? :)
Hvaležen bom vsakemu predlogu :)
Lp
T.***