html - Issue with box-sizing: border-box on a <aside> element -


i have issue using box-sizing: border-box on aside element.. screenshot provided below.

here code snippets site:

html:

<aside>      <h2 class="widgettitle">no active widgets</h2>      there no active widgets in area. </aside> <aside>      <h2 class="widgettitle">no active widgets</h2>      there no active widgets in area. </aside> <aside>      <h2 class="widgettitle">no active widgets</h2>      there no active widgets in area. </aside> <aside>      <h2 class="widgettitle">no active widgets</h2>      there no active widgets in area. </aside> 

css:

#footer .top aside {     float: left;     margin-bottom: 30px;     padding-right: 30px;     width: 25%;     box-sizing: border-box; } 

as can see on image, padding still outside of box. firebug doesn't show box-sizing property on css inspector.

image: http://s24.postimg.org/x2vl2z1b8/scr.jpg

unfortunately, firefox last browser still needs prefix box-sizing. add -moz-box-sizing: border-box; before box-sizing line, , should trick.


Comments

Popular posts from this blog

assembly - 8086 TASM: Illegal Indexing Mode -

Java, LWJGL, OpenGL 1.1, decoding BufferedImage to Bytebuffer and binding to OpenGL across classes -

javascript - addthis share facebook and google+ url -