PDA

View Full Version : problem with margin space


bio-TINMAN
12-15-2006, 09:24 AM
hi folks

i put an image as the background of a div tag, but then i get a left margin space . How do i remove it? i have tried margin-left:0;

im still unable to shoo away that white space. help please!

Stryker250
12-15-2006, 09:44 AM
have you made sure that your cellpadding and cellspacing is also = 0?

otherwise post your code and we can see what we can do for you;)

techietim
12-15-2006, 11:22 AM
padding-left: 0;

maybe...

bio-TINMAN
12-15-2006, 04:08 PM
hi.

heres teh code (pardon the sloppiness)



<HTML>
<head>
<style type="text/css">
/* trouble comes here */

#hello {position:absolute;top:8em;width:99%;height:17em;p adding:0;margin:0;}

/* trouble hopefully ends here */

#hello {background-image:url(2.gif); background-repeat: repeat-x;}
#yelp{background-image:url(1.gif);height:8em;width:800px;background-repeat:no-repeat;position:relative;top:4em;left:9em;}
p.title{font-family:arial;position:relative;top:19em;left:13em; width:50em;}
p.links{position:relative;top:23em;left:8em;width: 50em;}
p.footer{position:absolute;bottom:0em;font-family:arial; font-size:XX-small;left:48em;}
a:link{color:#24B8BD;font-family:arial;text-decoration:none;}
a:hover{text-decoration:underline;}
</style>
</head>
<body>
<div id="hello">
<div id="yelp">
</div>
</div>
<p class="title">Welcome</p>
<p class="links">|&nbsp; <a href="aboutus.html">About us</a>&nbsp; |&nbsp; <a href="jan_2007issue.html">Jan 2007 issue</a> &nbsp;
|&nbsp; <a href="archives.html">Archives</a>&nbsp; |&nbsp; <a href="sub_info.html">Subscription Information</a>&nbsp; |&nbsp; <a href="advt_info.html">Advertisement Tariff</a>&nbsp; |&nbsp; <a href="contact.html">Contact us</a>&nbsp; |
</p>
<p class="footer">copyright &copy; fishing chimes 1981 - 2007 </p>
</body>
</html>

Stryker250
12-15-2006, 04:15 PM
try what tim said


#hello {position:absolute;top:8em;width:99%;height:17em;p adding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}


just a hunch...:)

bio-TINMAN
12-15-2006, 07:47 PM
hi budds.. i finally found the solution, quite simple really, we all seemed to have missed it. i added the left:0em; and it did it.

#hello

{position:absolute;left:0em;top:8em;width:100%;hei ght:17em;padding-left:0;padding-right:0;padding-top:0
;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}



but guess where the new problem arises - COMPATIBILITY! somehow the 100% in width delivers a full flow in firefox from the left to the right of the screen, but in IE somehow, the 100% isnt 100%, it shows a white space to the right now! oh! the agony, some way around?

bio-TINMAN
12-16-2006, 08:55 AM
browser compatibility sux....

i think i have found a solution, i have added the width of the image to 102% to work in IE and then i have killed the scroll bar in firefox, using {overflow:hidden;}. its worked, but i would have liked a less "brutal"method.

thanks

DragoNero
12-17-2006, 03:15 AM
<table width="100%">
<td>
(site stuff ere!)
</td>
</table>

then change all of your sizes to percentages and it should stay the smae width as the tabel... unless you have stupid banners and the like ^^