Forums

Give help. Get help.

  • # August 22, 2008 at 12:57 am

    If I have:

    Code:

    and I do:

    Code:
    #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?

    Thanks.

    # August 22, 2008 at 11:42 am

    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:

    Code:
    #box1 { width:500px;}
    #box2 { padding:10px;}
    # August 24, 2008 at 7:22 pm

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

    # August 27, 2008 at 1:59 am

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

    # September 4, 2008 at 2:05 am

    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)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag