toplisek
04-05-2007, 09:34 AM
Hello,
I have tried many times but do not understand why Image can not be completely on the left.
there is line 329 in enclosed file:
<td width="366"><img src="index_files/homepage_mainimage2.gif" width="366" height="303"></td>
Need this image completely on the left without small space as you can se if you open in IE. Strange that in Mozilla it works without problem.
If I add sample text xyyxy in line 311 it will have white space between left menu (text xyyxy) and image homepage_mainimage2.gif
I kindly aks you to send me what I have to change that it will work.
Enclosed is complete file.
Regards:confused:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Testing page</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<style type="text/css">
* {
margin:0;
padding: 0;
}
#wrapper {
width: 771px;
margin: 0 auto;
font-size: 80%;
color: #54628a;
line-height: 1.5em;
text-align: left;
}
#header {
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #FF9300;
top: 36px;
}
#logo {
background-repeat: no-repeat;
height: 56px;
top: 0px;
right: 0px;
width: 120px;
}
#navbar {
background-image: url(index_files/index_bar.gif);
background-repeat: repeat-x;
height: 20px;
width: 771px;
}
#midbar {
width: 771px;
top: 50px;
background-repeat: repeat-x;
background-image: url(index_files/index_bar.gif);
height: 17px;
}
#holderdiv {
padding-right: 10px;
padding-left: 10px;
margin-right: 0px;
width: 180px;
background-color: #FEEAB7;
}
.leftcoldiv {
margin: 10px 0px;
border: 1px solid #323c5a;
background-color: #FFFFFF;
width: 100%;
}
.leftcoldivlight {
margin: 10px 0px;
border: 1px solid #323c5a;
background-color: #f5f7ff;
width: 100%;
}
body {
font-family: Arial, Helvetica, sans-serif;
text-align: left;
font-size: 100%;
padding-top: 20px;
padding-bottom: 20px;
background-image: url(index_files/fondo2.GIF);
background-position: left;
}
p {
}
.leftcoldiv p {
margin: 5px 0;
padding: 5;
color: #323c5a;
font-size: 90%;
line-height: 1.3em;
}
.leftcoldivlight p {
margin: 5px 0;
padding: 5;
color: #323c5a;
font-size: 90%;
line-height: 1.3em;
}
.leftcoldiv h2 {
margin: 0;
background-color: #98a5cb;
color: #000000;
font-size: 120%;
padding: 1px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #323c5a;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #bec6df;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
.leftcoldiv h3 {
margin: 0;
background-color: #ff9300;
color: #000000;
font-size: 120%;
padding: 1px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #323c5a;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #fec16f;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
.leftcoldivlight h4 {
margin: 0;
color: #000000;
font-size: 120%;
padding: 1px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #323c5a;
background-image: url(index_files/index_h4bg.gif);
background-repeat: repeat-x;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #f5f7ff;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
}
h1 {
font-size: 130%;
margin: 0px;
color: #000000;
padding-top: 6px;
padding-left: 10px;
font-family: Arial, Helvetica, sans-serif;
}
h2 {
font-size: 120%;
color: #000000;
margin-top: 4px;
margin-bottom: 2px;
}
ol {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 25px;
color: #54628a;
}
ul {
margin-top: 0px;
margin-bottom: 0px;
color: #54628a;
font-size: 80%;
font-weight: normal;
list-style-type: disc;
list-style-image: url(index_files/index_bullet.gif);
}
a:link {
color: #ff9300;
}
a:visited {
color: #ff9300;
}
a:link:hover {
color: #ffffff;
}
.divider {
border-top-width: 1px;
border-top-style: solid;
border-top-color: #54628a;
}
.left {
float: left;
}
.right {
float: right;
}
.footer {
font-size: 75%;
border-top-width: 2px;
border-top-style: solid;
border-top-color: #ff9300;
background-image: url(index_files/index_bar.gif);
background-repeat: repeat-x;
width: 771px;
text-align: center;
padding-top: 4px;
padding-bottom: 8px;
color: #FEEAB7;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #98a5cb;
border-left-color: #98a5cb;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #54628a;
}
#rightcoldiv {
background-color: #FFFFFF;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 200px;
padding-bottom: 10px;
padding-top: 10px;
}
.coldiv2
{
background-color:#FFFFFF;
border-top: 1px solid #E6D3A8;
color: #000000;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #E6D3A8;
background-position: top;
}
}
.coldiv h1{
margin: 8px 0 10px;
background-color: #faf9f5;/*themecolour3;*/
border-top: 1px solid #E6D3A8;
border-bottom: 1px solid #E6D3A8;
padding: 1px 0px 3px 0px;
color: #000000;
}
.style1 {
vertical-align:top;
font-size: 14px;
font-weight: bold;
color: #D26200;
}
-->
</style>
</head>
<body leftmargin="0" topmargin="0" border=1>
<div id="wrapper">
<div id="header"><table width="770" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top"><div align="right"><img src="index_files/Banner_772_px.jpg" /></td>
<td valign="top"><div align="left"><img src="index_files/Banner772_pxlogo.jpg" width="297" height="113"/></td>
</tr>
</table>
</div>
<div id="midbar">
<div align="center" >
</div>
</div>
<div class="left" id="holderdiv">
xyyxy
<div>
</div>
</div>
<!--start of right-hand column content-->
<div id="rightcoldiv">
<div class="coldiv2">
<table width="566" height="39" cellpadding="5" cellspacing="0">
<tr>
<td width="366"><img src="index_files/homepage_mainimage2.gif" width="366" height="303"></td>
<td width="198"><table width="195" height="298">
<tr>
<td width="10" height="298"> </td>
<td width="160" valign="top"><p class="style1">Welcome</p>
<p></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</td>
<td width="9"> </td>
</tr>
</table></td>
</tr>
</table>
</div>
</div>
<!-- -->
<div style="clear: both;"></div>
<div class="footer">
<span></span>
</div>
</div>
</body>
</html>
I have tried many times but do not understand why Image can not be completely on the left.
there is line 329 in enclosed file:
<td width="366"><img src="index_files/homepage_mainimage2.gif" width="366" height="303"></td>
Need this image completely on the left without small space as you can se if you open in IE. Strange that in Mozilla it works without problem.
If I add sample text xyyxy in line 311 it will have white space between left menu (text xyyxy) and image homepage_mainimage2.gif
I kindly aks you to send me what I have to change that it will work.
Enclosed is complete file.
Regards:confused:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Testing page</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<style type="text/css">
* {
margin:0;
padding: 0;
}
#wrapper {
width: 771px;
margin: 0 auto;
font-size: 80%;
color: #54628a;
line-height: 1.5em;
text-align: left;
}
#header {
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #FF9300;
top: 36px;
}
#logo {
background-repeat: no-repeat;
height: 56px;
top: 0px;
right: 0px;
width: 120px;
}
#navbar {
background-image: url(index_files/index_bar.gif);
background-repeat: repeat-x;
height: 20px;
width: 771px;
}
#midbar {
width: 771px;
top: 50px;
background-repeat: repeat-x;
background-image: url(index_files/index_bar.gif);
height: 17px;
}
#holderdiv {
padding-right: 10px;
padding-left: 10px;
margin-right: 0px;
width: 180px;
background-color: #FEEAB7;
}
.leftcoldiv {
margin: 10px 0px;
border: 1px solid #323c5a;
background-color: #FFFFFF;
width: 100%;
}
.leftcoldivlight {
margin: 10px 0px;
border: 1px solid #323c5a;
background-color: #f5f7ff;
width: 100%;
}
body {
font-family: Arial, Helvetica, sans-serif;
text-align: left;
font-size: 100%;
padding-top: 20px;
padding-bottom: 20px;
background-image: url(index_files/fondo2.GIF);
background-position: left;
}
p {
}
.leftcoldiv p {
margin: 5px 0;
padding: 5;
color: #323c5a;
font-size: 90%;
line-height: 1.3em;
}
.leftcoldivlight p {
margin: 5px 0;
padding: 5;
color: #323c5a;
font-size: 90%;
line-height: 1.3em;
}
.leftcoldiv h2 {
margin: 0;
background-color: #98a5cb;
color: #000000;
font-size: 120%;
padding: 1px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #323c5a;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #bec6df;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
.leftcoldiv h3 {
margin: 0;
background-color: #ff9300;
color: #000000;
font-size: 120%;
padding: 1px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #323c5a;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #fec16f;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
.leftcoldivlight h4 {
margin: 0;
color: #000000;
font-size: 120%;
padding: 1px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #323c5a;
background-image: url(index_files/index_h4bg.gif);
background-repeat: repeat-x;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #f5f7ff;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
}
h1 {
font-size: 130%;
margin: 0px;
color: #000000;
padding-top: 6px;
padding-left: 10px;
font-family: Arial, Helvetica, sans-serif;
}
h2 {
font-size: 120%;
color: #000000;
margin-top: 4px;
margin-bottom: 2px;
}
ol {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 25px;
color: #54628a;
}
ul {
margin-top: 0px;
margin-bottom: 0px;
color: #54628a;
font-size: 80%;
font-weight: normal;
list-style-type: disc;
list-style-image: url(index_files/index_bullet.gif);
}
a:link {
color: #ff9300;
}
a:visited {
color: #ff9300;
}
a:link:hover {
color: #ffffff;
}
.divider {
border-top-width: 1px;
border-top-style: solid;
border-top-color: #54628a;
}
.left {
float: left;
}
.right {
float: right;
}
.footer {
font-size: 75%;
border-top-width: 2px;
border-top-style: solid;
border-top-color: #ff9300;
background-image: url(index_files/index_bar.gif);
background-repeat: repeat-x;
width: 771px;
text-align: center;
padding-top: 4px;
padding-bottom: 8px;
color: #FEEAB7;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #98a5cb;
border-left-color: #98a5cb;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #54628a;
}
#rightcoldiv {
background-color: #FFFFFF;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 200px;
padding-bottom: 10px;
padding-top: 10px;
}
.coldiv2
{
background-color:#FFFFFF;
border-top: 1px solid #E6D3A8;
color: #000000;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #E6D3A8;
background-position: top;
}
}
.coldiv h1{
margin: 8px 0 10px;
background-color: #faf9f5;/*themecolour3;*/
border-top: 1px solid #E6D3A8;
border-bottom: 1px solid #E6D3A8;
padding: 1px 0px 3px 0px;
color: #000000;
}
.style1 {
vertical-align:top;
font-size: 14px;
font-weight: bold;
color: #D26200;
}
-->
</style>
</head>
<body leftmargin="0" topmargin="0" border=1>
<div id="wrapper">
<div id="header"><table width="770" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top"><div align="right"><img src="index_files/Banner_772_px.jpg" /></td>
<td valign="top"><div align="left"><img src="index_files/Banner772_pxlogo.jpg" width="297" height="113"/></td>
</tr>
</table>
</div>
<div id="midbar">
<div align="center" >
</div>
</div>
<div class="left" id="holderdiv">
xyyxy
<div>
</div>
</div>
<!--start of right-hand column content-->
<div id="rightcoldiv">
<div class="coldiv2">
<table width="566" height="39" cellpadding="5" cellspacing="0">
<tr>
<td width="366"><img src="index_files/homepage_mainimage2.gif" width="366" height="303"></td>
<td width="198"><table width="195" height="298">
<tr>
<td width="10" height="298"> </td>
<td width="160" valign="top"><p class="style1">Welcome</p>
<p></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</td>
<td width="9"> </td>
</tr>
</table></td>
</tr>
</table>
</div>
</div>
<!-- -->
<div style="clear: both;"></div>
<div class="footer">
<span></span>
</div>
</div>
</body>
</html>