The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS width:100% + padding/margin question

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #22836

    If I have:


    and I do:

    #box1 { width:500px; }
    #box2 { width:100%; padding:10px; }

    The 10px padding of #box2 will be allocated outside of #box1. According to the box model, this is the correct behavior (except for buggy IE6). But that is not what I want, I want the padding for #box2 remain inside #box1 and keeping the width in %.

    How can I do that?



    Why do you want to keep the width of box2 in % when its fixed at 500px because of box1?

    If you want 10px padding inside box1, just have:

    #box1 { width:500px;}
    #box2 { padding:10px;}

    If you don’t give box2 a fixed width, it’s going to fill the available space of it’s parent by default ;)


    Sorry but I forgot to mention the #box2 is floated.


    Because #box2 contains floating elements, and in order to wrap those elements, I need to float #box2 and also #box1…

    I don’t have any example on hand right now, =(

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.