Padding problem

Discussion in 'HTML & Website Design' started by Pizzaandfries, May 27, 2009.

0
  1. #1
    I'm having trouble with a padding issue - namely getting the padding around an object or Iframe to sit right on top of the joining images. However, I can't figure out why there is an external padding to the left, right, and bottom parts of the object and not the top.

    Here is an image of the problem
    [​IMG]

    Below is the doc.


    Thoughts?
     
    Pizzaandfries, May 27, 2009 IP
  2. Astroman

    Astroman Well-Known Member

    Messages:
    2,355
    Likes Received:
    71
    Best Answers:
    0
    Trophy Points:
    135
    #2
    Those <br /> tags won't be helping much, get rid of them and use DIVs with set width instead. I think you could organize your images in a much simpler way too, but just try without the <br /> tags first, use a different method. You can put style on the <br /> tags to reduce the line height to zero, but I think it's better to do it a different way.

    Also this </noscript> isn't doing anything at all and shouldn't be there, and the <p> and </p> don't need to be there either.

    Oh and that last </span> isn't doing anything because you already have a </span> further up the page.

    ... and you can't have margin="0" and padding="0" in your iframe tag.
     
    Astroman, May 27, 2009 IP
  3. unigogo

    unigogo Peon

    Messages:
    286
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    0
    #3
    margin and padding are not the HTML properties but CSS properties.

    CSS properties must be in the style property of HTML tags. It looks like

    <div style="margin:0px;padding:5px"></div>
     
    unigogo, May 27, 2009 IP
  4. Pizzaandfries

    Pizzaandfries Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Well the solution to DIV tag it up worked well - I rewrote it from scratch and that seemed to work much better than letting Dreamweaver put it together.

    I have a problem with padding and the scrollbar. The center image on my page is exactly 695x433 pixels, and anything I toss in that isn't bigger than these dimensions has No problem. However, when I direct a page to this that is bigger than 433 in height, the vertical scroll bar is enabled and pushes the page over, enabling the horizontal scroll bar (see the picture) when I'm looking for it to overlap and still keep that 695px and not add the extra pixel width with the scrollbar attached. Using overlap settings within CSS that hide the horizontal scrolling bar, it works perfectly in Firefox, but not in IE (you get the picture below).

    My css rules looks like this:
    iframe {
    overflow-x: hidden;
    }

    None of the overflow-y rules change anything. Thoughts?

    Picture:
    [​IMG]

    or rather simply go to the site: bluelightbanditsmovie.com
     
    Pizzaandfries, May 28, 2009 IP