Home/ Questions/Q 6705037
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T07:21:27+00:00

I have a simple question where my the stuff in my div are not

  • 0

I have a simple question where my the stuff in my div are not without margin.
Specifically, when set margin, padding and border all to 0, there is still whitespace between elements

Code:

<div id="menu" >
<a href="#" style="margin:0;border:0;padding:0;background:red">sup</a>

<a href="#" style="margin:0;border:0;padding:0;background:red">sup</a>

</div>

Just by adding these codes to an empty text file and saving as html, there is white spaces between the elements, unless I specifically set a negative margin. This would work, but I just want to know why is it not 0 when it is specifically set to 0.

Thanks in advance 😀

New finding :

I was trying to make the above into display:block to display one on top of another just when I found out that

upon adding this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

It did not work

I was supposed to use this doctype but it does not work now.

Any solutions?

The code is as follows: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<div id="kingmenu"  style="position:absolute;top:90px;left:290px;width:55px;">
<a href="#"><img src="http://white-attic.com/themes/prestashop/img/kingtop.png"></a><a href="#"><img src="http://white-attic.com/themes/prestashop/img/kingbottom.png"></a>
</div>

problem is as shown in this screencap:
http://img828.imageshack.us/img828/8331/whitespace.jpg

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The whitespace is in your markup.

    Even if you set the a elements to inline-block (which they are not by default), you would still see the (normalized) space that is there in your HTML.

    To eliminate this you have to “butt” the elements up against one another.

    UPDATE: Your file should now look like this:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<div id="menu" ><a href="#" style="margin:0;border:0;padding:0;background:red">sup</a><a href="#" style="margin:0;border:0;padding:0;background:red">sup</a></div>

    I have checked in Chrome, Firefox 6 and IE 8 that there is no space between the links.

    • 0