Quick Problem

Discussion in 'CSS' started by jon2k6, Aug 1, 2007.

  1. #1
    Hi, can anyone tell me the solution to this quick annoying little problem.

    Can someone please tell me why:

    http://www.eminemnow.com/audio.html

    This Div boxes on those pages are messed up in Firefox n fine in IE, the divs are defined in my external CSS. They were working fine in both browsers before but for some reason are now doing this.

    Also notice the one holding ''the marshall math..'' is more messed than the others.
    I've figured out it must be because there is a 15px margin on box2 and box3 divs holding the image then the text and I've made box 3 width 'inherit' and it's all in a table so it's obviously inheriting the width of the table box.

    However I have no idea why that marshall mathers box is doing that!?

    It also does it on this page:

    http://www.eminemnow.com/bio.html

    On the IMBD box but fine on the other 2 :S ?
     
    jon2k6, Aug 1, 2007 IP
  2. Clive

    Clive Web Developer

    Messages:
    4,507
    Likes Received:
    297
    Best Answers:
    0
    Trophy Points:
    250
    #2
    This code works fine for me:
    #box2
    {
    width: 120px;
    margin-right:15px;
    border: 1px dashed #CCC713;
    }
    
    #box3
    {
    margin-right:15px;
    margin-bottom:15px;
    padding-top:5px;
    padding-bottom:5px;
    border-left: 1px dashed #CCC713;
    border-right: 1px dashed #CCC713;
    border-bottom: 1px dashed #CCC713;
    text-align:center;
    }
    
    Code (markup):
    Doing what, forcing a bigger value for the height?
    That's because the <td> tag that box is in has got the height="155" attribute. Take that off and the problem will go away.
     
    Clive, Aug 3, 2007 IP