Forum Moderators: not2easy
Here's the current code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Kitarakamat [Kitarat]</title>
<link href="tyyli.css" rel="stylesheet" type="text/css">
</head>
<body><div id="logo"><div id="valikko"><br><br><br><br><br>
<a href="index.html">Etusivu</a> ¦
<a href="kitarat.php">Kitarat</a> ¦
<a href="vahvistimet.php">Vahvistimet</a> ¦
<a href="efektit.php">Efektit</a> ¦
<a href="nauhoitus.php">Nauhoitus</a> ¦
<a href="vieraskirja.php">Vieraskirja</a> ¦
<a href="linkit.php">Linkit</a>
</div></div>
<div id="perusta">
<div id="sisalto">
<div id="teksti">
<B>Kitarat</B><br>
<br>
*page text*
<div class="data">
<div class="otsik">Jackson DX7</div></div>
<br>
<img src="dx7.jpg" alt="Jackson DX7"><br>
*page text*
<br>
<div class="data"><div class="otsik">Epiphone PR100 Natural</div></div>
<br>
<img src="pr100.jpg" alt="Epiphone PR100 Natural"><br>
*page text*
</div>
</div></body>
</html>
and the CSS:
body {
height: auto;
background-color: #3B6183;
background-image: url(tausta.jpg);
color: black;
font-size: 10px;
font-family: verdana;
margin: 4px;}#logo {
width: 661px;
height: 83px;
margin-left: auto;
margin-right: auto;
text-align: center;
padding-top: 3px;
background-image: url(logo.jpg);
background-repeat: no-repeat; }#valikko {
width: 661px;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
text-align: center;
color: white;}#perusta {
width: 640px;
height: 100%;
border: solid 2px black;
background-color: white;
text-align: center;
margin-top: 4px;
margin-left: auto;
margin-right: auto; }#sisalto {
width: 632px;
height: auto;
border: solid 1px black;
background-color: white;
text-align: center;
margin-top: 4px;
margin-left: auto;
margin-right: auto;
margin-bottom: 4px; }#teksti {
padding: 4px;
width: 624px;
height: 100%;
text-align: justify; }.otsik { font-size: 12px; font-weight: bold; color: white; text-align: center; }
.data { border-style: outset; border-width: 2px; color: padding: 1px; grey; width: 496px; background-color:
#517697;}
A:LINK {
color: white;
text-decoration: none;
font-weight: bold;
font-size: 10px;
font-family: verdana; }A:VISITED {
color: white;
text-decoration: none;
font-weight: bold;
font-size: 10px;
font-family: verdana; }A:HOVER {
color: white;
text-decoration: underline;
font-weight: bold;
font-size: 10px;
font-family: verdana; }
So, with the above, if the page has more data than can be shown on one single view area (so that the scrollbars appear), the page data shifts by 10 pixels or so to the left. Is there any way I can prevent this as it looks unprofessional.
Thanks
[webmasterworld.com...]
