«

hi

this markup create a tiny space between this markup and the rest of the
content on the page. the space is maybe 3 px height.

The problem occur because the inner div override the outer div, with that I
mean that the content of inner div flows over the outer div.

The problem occur first when I add second picture the inner div, with only 1
image the space isn't there...

The width of the images is 113px, and height:31px;

The background-color:Lime is just for debuging, to show how large the inner
div is. it looks like below the images the div have 3 px padding, it is this
padding which create the space problem..

another problem:
not sure if margin-top:76px is any good but I want the inner div to be
placed to the bottom right of the outer div...

<div style="width:960px; height:108px;
background-image:url('Images/Background/helloworld.jpg');">
<div style="float:right; background-color:Lime; margin-top:76px;">
<a href="Pages/Default.aspx"><img src="Images/test1.png"
style="border-style:none;" /></a>
<a href="Pages/Default.aspx"><img src="Images/test2.png"
style="border-style:none;" /></a>
</div>
</div>

any suggestions?

On Mar 24, 8:41*am, "Jeff" <it_consulta...@hotmail.com.NOSPAM> wrote:
> hi
>
> this markup create a tiny space between this markup and the rest of the
> content on the page. the space is maybe 3 px height.
>
> The problem occur because the inner div override the outer div, with that I
> mean that the content of inner div flows over the outer div.
>
> The problem occur first when I add second picture the inner div, with only 1
> image the space isn't there...
>
> The width of the images is 113px, and height:31px;
>
> The background-color:Lime is just for debuging, to show how large the inner
> div is. it looks like below the images the div have 3 px padding, it is this
> padding which create the space problem..
>
> another problem:
> not sure if margin-top:76px is any good but I want the inner div to be
> placed to the bottom right of the outer div...
>
> <div style="width:960px; height:108px;
> background-image:url('Images/Background/helloworld.jpg');">
> * * <div style="float:right; background-color:Lime; margin-top:76px;">
> * * * * <a href="Pages/Default.aspx"><img src="Images/test1.png"
> style="border-style:none;" /></a>
> * * * * <a href="Pages/Default.aspx"><img src="Images/test2.png"
> style="border-style:none;" /></a>
> * *</div>
> </div>
>
> any suggestions?

Try to remove space and line breaks between tags within the div
container

....margin-top:76px;"><a....</a><a...</a></div>....

Hope this helps

Try to remove space and line breaks between tags within the div
container

....margin-top:76px;"><a....</a><a...</a></div>....

I thought that wouldn't fix the problem, now I'm in full surprise as it
actually fixed the problem.

cheers

On Mar 24, 3:10*pm, "Jeff" <it_consulta...@hotmail.com.NOSPAM> wrote:
> Try to remove space and line breaks between tags within the div
> container
>
> ...margin-top:76px;"><a....</a><a...</a></div>....
>
> I thought that wouldn't fix the problem, now I'm in full surprise as it
> actually fixed the problem.
>
> cheers *

Great! Glad you got that working, I think the problem is because of
the space (a space for a letter) and if font size is big you see that
as a space between the images. You can also try to set font-size (e.g.
font-size: 1) to see if it helps.

Cheers