Problem figuring out css padding and so fourth

[jesse23]

Hey guys whats up, pardon if my question is sloppy ive just been working on my site for like 6 or 7 hours straight and have got caught up on a css issue. Im not very familiar with and have been researching  with no apparent answers. ok here goes. I am trying to eliminate the padding or boarder width im not sure from a box so i can make this yahoo news ticker fit into a box with maximum size without breaking up my site. my website is http://www.campusgoal.com so you can see what i mean. /* CSS Document */

 

/* Global Styles */
html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address 
{
    margin: 0;
    padding: 0;
    
font-family: Arial, sans-serif;
    font-size: 10px;
    color: #333333;
background-color: #FFFFFF;
text-align: left; 
}

a           
{
    text-decoration: none;
    color: #B50C00;
    font-weight: normal;
}

a:hover     
{
    text-decoration:underline;
} 
   
img 
{
border-width: 0;
}

.box1TextBG {
  
}



.text1ABG { background: url(images/1TextABG.jpg) no-repeat top; }
.main2BG { background: url(images/2MainBG.jpg) repeat-x; }
.left3ABG { background: url(images/3LeftABG.jpg) repeat-y; }
.left3BBG { background: url(images/3LeftBBG.jpg) repeat-y; }
.box1LBG { background: url(images/box1LBG.jpg) repeat-y; }

.box1RBG { background: url(images/box1RBG.jpg) repeat-y; }
.mid3BG { background: url(images/3MidBG.jpg) repeat-y; }
.box2LBG { background: url(images/box2LBG.jpg) repeat-y; }

.box2RBG { background: url(images/box2RBG.jpg) repeat-y; }
.right3BG { background: url(images/3RightBG.jpg) repeat-y; }
.bot4BG { background: url(images/4botBG.jpg) repeat-x; }
.left5BG { background: url(images/5Left.jpg) no-repeat top; }
.main5BG { background: url(images/5BG.jpg) repeat-x; }

.topNav
{
font-family: arial, verdana;
font-size: 10px;
color: #ffffff;
font-weight: normal;
padding: 0px 12px;
text-decoration: none;
}




school {
background-color: #000000;
font-size: 12px;
border-width: 0;
margin: 0;
padding: 0;
color: #ffffff;
}

.titleText
{
font-size: 14px;
font-weight: bold;
margin: 10px 10px;
text-align: left;
color: #B50C00;
}

.mainText
{
font-weight: normal;	
margin: 10px 10px;
text-align: left;
}

   .amazines a
{

     text-decoration: none;

     color: #B50C00 ;

     font: 15px Arial, sans-serif;

     font-weight: bold;

     }

     a:hover {

     text-decoration: underline;

     }

/* Logoworks link back */
.logoworks
{
font-family: arial, verdana; 
font-size: 9px;
color: #FFFFFF;
font-weight: normal;
padding: 0px 40px;
text-decoration: none;
text-align: left;
}

.logoworksLink
{
font-family: arial, verdana; 
font-size: 9px;
color: #FFFFFF;
font-weight: normal;
text-decoration: none;
text-align: left;
}

im not sure if you need the whole css sheet but just in case i posted it above. Also here is the table in question.

 

<td width="339"><table cellpadding="0" cellspacing="0" border="0" width="309" height="87%">
			<tr>
				<td width="15"><img src="images/box1TL2 copy.jpg" width="15" height="15" /></td>
				<td colspan="2"><img src="images/box1T.jpg" width="308" height="15" /></td>
				<td width="15"><img src="images/box1TR2 copy.jpg" width="15" height="15" /></td>
			</tr>
			<tr>
				<td class="box1LBG" valign="top" height="100%"><img src="images/box1L1.jpg" width="15" height="224" /></td>
			  
				<td class="box1TextBG" valign="top" width="1" height="25">
					<br />
					<br />
					<div class="mainText">
						<script src=
"http://www.tickermyfeed.com/feed.php?P3RpdGxlX2ZvbnRmYW1pbGx5PVZlcmRhbmEsIEFyaWFsLCBIZWx2ZXRpY2EsIHNhbnMtc2VyaWYmdGl0bGVfZm9udHNpemU9MTEmdGl0bGVfdGV4dGNvbG9yPSMwMDAwQ0MmdGl0bGVfaG92ZXJjb2xvcj0jRkYwMDAwJnRpdGxlX2FsaWdtZW50PWxlZnQmdGl0bGVfZm9udHN0eWxlPXJlZ3VsYXImYWxpZ21lbnQ9bGVmdCZib3h3aWR0aD0yNTAmYm94aGVpZ2h0PTE1MCZmb250c3R5bGU9cmVndWxhciZmb250ZmFtaWxseT1WZXJkYW5hLCBBcmlhbCwgSGVsdmV0aWNhLCBzYW5zLXNlcmlmJnRleHRjb2xvcj0jMDAwMDAwJmhvdmVyY29sb3I9I0ZGMDAwMCZiZ2NvbG9yPSNGRkZGRkYmZm9udHNpemU9MTEmYm94d2lkdGg9MjUwJmJveGhlaWdodD0xNTAmYm94aXRlbXM9OSZzaG93aW1nPTEmc2hvd3Njcm9sbD0xJmJvcmRlcnNpemU9JnNob3dib3JkZXI9MCZib3JkZXJjb2xvcj0jMDAwMDAwJnJ1bm5pbmc9MCZzcGVlZD0xJnJzc195YWhvbz0xJnJzc2xpbmtfeWFob289Ulc1MFpYSWdTMlY1ZDI5eVpITWdTR1Z5WlE9PSZyc3NsaW5rX2dvb2dsZT1SVzUwWlhJZ1MyVjVkMjl5WkhNZ1NHVnlaUT09JnJzc2xpbms9Ulc1MFpYSWdWVkpNSUVobGNtVT0mc291cmNlPWh0bWwmanNjcmlwdD0x"> </script>			   <br />
						<div align="left">							</div>
			  </div>					</td>
			  <td width="307"></td>
			<td class="box1LBG" valign="top" height="100%"><img src="images/box1R.jpg" width="15" height="224" /></td>
			</tr>
			<tr>
				<td><img src="images/Box1BL1 copy.jpg" width="15" height="15" /></td>
				<td colspan="2"><img src="images/box1B.jpg" width="308" /></td>
				<td><img src="images/box1BR.jpg" width="15" height="15" /></td>
			</tr>
	</table></td>

Thanks again for your help.

[mainewoods]

never do this:

    margin: 0;
    padding: 0;

instead always add the unit type:

    margin: 0px;
    padding: 0px;

if you do not add the unit type, browsers like ff are liable to just ignore your setting.  In fact about the only browser that would render your code is ie.  Always specifie the unit as well as the number in margins, padding, borders, ect. Always specifying the unit type is the 'standards' standard.

 

 

[wildteen88]

never do this:

    margin: 0;
    padding: 0;

instead always add the unit type:

    margin: 0px;
    padding: 0px;

if you do not add the unit type, browsers like ff are liable to just ignore your setting.  In fact about the only browser that would render your code is ie.  Always specifie the unit as well as the number in margins, padding, borders, ect. Always specifying the unit type is the 'standards' standard.

You should only specify a unit with a size that is greater than 0. You don't need to specify a unit if the size is 0 as 0px is the same as 0em, 1px is not the same as 1em.