another IE8, firefox markup problem

Discussion in 'ASP .Net' started by Jeff, Mar 24, 2009.

  1. Jeff

    Jeff Guest

    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?
     
    Jeff, Mar 24, 2009
    #1
    1. Advertising

  2. On Mar 24, 8:41 am, "Jeff" <> 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
     
    Alexey Smirnov, Mar 24, 2009
    #2
    1. Advertising

  3. Jeff

    Jeff Guest

    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 :)
     
    Jeff, Mar 24, 2009
    #3
  4. On Mar 24, 3:10 pm, "Jeff" <> 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
     
    Alexey Smirnov, Mar 24, 2009
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Jeff
    Replies:
    3
    Views:
    1,411
  2. Robert GNLD

    Ajax and IE8 problem

    Robert GNLD, May 18, 2009, in forum: ASP .Net
    Replies:
    0
    Views:
    2,316
    Robert GNLD
    May 18, 2009
  3. Adrienne Boswell

    Re: IE8 picture list display problem

    Adrienne Boswell, Jun 30, 2009, in forum: HTML
    Replies:
    1
    Views:
    694
    GTalbot
    Jul 13, 2009
  4. AAaron123
    Replies:
    6
    Views:
    599
    AAaron123
    Aug 17, 2009
  5. cecile

    ie8!=ie8

    cecile, May 24, 2010, in forum: Javascript
    Replies:
    2
    Views:
    210
    David Mark
    May 24, 2010
Loading...

Share This Page