It appears you have not yet registered with DEVPPL. To register please click here... (it's fast, easy and free!)

Forum

Log In Sponsors
Board index Programming HTML Forum

why does this table have space on left? (try it on browser)

why does this table have space on left? (try it on browser)

Postby wicked7578 on Fri Nov 05, 2010 6:26 am

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Jung Woo Kim</title>
<link rel="stylesheet" href="demo.css" type="text/css" />
<script type="text/javascript" src="../mootools.js"></script>
<script type="text/javascript" src="demo.js"></script>


<style type="text/css">
<!--
body {

background-color: #000;
background-image: url(image/back.jpg);
background-repeat: no-repeat;
}

.vert {
width: 100%;
height: 340px;

position: absolute;
top: 50%;
left: 50%;
margin: -170px 0 0 -357px;


}

a.rollover {
display: block;
width: 56px;
height: 15px;
text-decoration: none;
background: url("../images/menu_03.gif") no-repeat 0 0;
}

a.rollover:hover {
background-position: 0 -15px;
}

a.rollover:active {
background-position: 0 -15px;
}



.displace {
position: absolute;
left: -5000px;
}


a.rollover2 {
display: block;
width: 67px;
height: 16px;
text-decoration: none;
background: url("../images/menu_05.gif") no-repeat 0 0;
}

a.rollover2:hover {
background-position: 0 -16px;
}

a.rollover2:active {
background-position: 0 -16px;
}

a.rollover3 {
display: block;
width: 100px;
height: 16px;
text-decoration: none;
background: url("../images/menu_07.gif") no-repeat 0 0;
}

a.rollover3:hover {
background-position: 0 -16px;
}

a.rollover3:active {
background-position: 0 -16px;
}

a.rollover4 {
display: block;
width: 74px;
height: 16px;
text-decoration: none;
background: url("../images/menu_09.gif") no-repeat 0 0;
}

a.rollover4:hover {
background-position: 0 -16px;
}

a.rollover4:active {
background-position: 0 -16px;
}









-->
</style></head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div class="vert">

<td align="left" bgcolor="#000000"><table width="100%" align="left" height="340" border="0" cellpadding="0" cellspacing="0" valign="middle" background="image/transparent.png">
<tr>
<td align="left">&nbsp;</td>
</table></td>


</body>
</html>
wicked7578
 
Posts: 2
Joined: Fri Nov 05, 2010 6:20 am

Re: why does this table have space on left? (try it on browser)

Postby HotNoob on Sun Nov 07, 2010 4:13 am

lol thats totally screwed up:

<td align="left" bgcolor="#000000"><table width="100%" align="left" height="340" border="0" cellpadding="0" cellspacing="0" valign="middle" background="image/transparent.png">
<tr>
<td align="left">&nbsp;</td>
</table></td>

should be:
Code: Select all
<table width="100%" align="left" height="340" border="0" cellpadding="0" cellspacing="0" valign="middle" background="image/transparent.png">
   <tr>
      <td bgcolor="#000000">
      </td>
      <td>
         &nbsp;
      </td>
   </tr>
</table>
HotNoob
100+ Club
 
Posts: 169
Joined: Sun May 02, 2010 1:38 am

Re: why does this table have space on left? (try it on browser)

Postby wicked7578 on Thu Nov 11, 2010 6:19 am

well, actually what i was really trying to do was to make this table's width 100% using class "vert" made in css but table never fills up the entire width! Table is supposed to be vertically centered using CSS and horizontally fit the screen. I fixed the code below. thanks!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Jung Woo Kim</title>
<link rel="stylesheet" href="demo.css" type="text/css" />


<style type="text/css">
<!--
body {

background-color: #000;
background-image: url(image/back.jpg);
background-repeat: no-repeat;
}

.vert {
width: 100%;
height: 340px;

position: absolute;
top: 50%;
left: 50%;
margin: -170px 0 0 -680px;


}

a.rollover {
display: block;
width: 56px;
height: 15px;
text-decoration: none;
background: url("../images/menu_03.gif") no-repeat 0 0;
}

a.rollover:hover {
background-position: 0 -15px;
}

a.rollover:active {
background-position: 0 -15px;
}



.displace {
position: absolute;
left: -5000px;
}


a.rollover2 {
display: block;
width: 67px;
height: 16px;
text-decoration: none;
background: url("../images/menu_05.gif") no-repeat 0 0;
}

a.rollover2:hover {
background-position: 0 -16px;
}

a.rollover2:active {
background-position: 0 -16px;
}

a.rollover3 {
display: block;
width: 100px;
height: 16px;
text-decoration: none;
background: url("../images/menu_07.gif") no-repeat 0 0;
}

a.rollover3:hover {
background-position: 0 -16px;
}

a.rollover3:active {
background-position: 0 -16px;
}

a.rollover4 {
display: block;
width: 74px;
height: 16px;
text-decoration: none;
background: url("../images/menu_09.gif") no-repeat 0 0;
}

a.rollover4:hover {
background-position: 0 -16px;
}

a.rollover4:active {
background-position: 0 -16px;
}









-->
</style></head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<div class="vert">
<table align="left" height="340" width="100%" border="0" cellpadding="0" cellspacing="0" valign="middle" background="image/transparent.png">
<tr>
<td>&nbsp;</td>
</tr>
</table></div>


</body>
</html>
wicked7578
 
Posts: 2
Joined: Fri Nov 05, 2010 6:20 am


Who is online

Users browsing this forum: No registered users and 7 guests