# \[CSS\] No wrap around on floats

**URL:** <https://forum.kirupa.com/t/css-no-wrap-around-on-floats/250112>\
**Category:** web dev\
**Created:** [January 25, 2008, 6:33pm UTC](https://forum.kirupa.com/t/css-no-wrap-around-on-floats/250112 "2008-01-25T18:33:09Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![NeoDreamer](https://avatars.discourse-cdn.com/v4/letter/n/ccd318/32.png) [@NeoDreamer](https://forum.kirupa.com/u/NeoDreamer)\
**Post date:** [January 25, 2008, 6:33pm UTC](https://forum.kirupa.com/t/css-no-wrap-around-on-floats/250112/1 "2008-01-25T18:33:09Z")

</div>

As you may know from the CSS box model, borders contribute to the actual width of a DIV. For example, if a DIV has width: 50px and border-left: 1px, then the actual width is 51px.

_figure 1_  
 ![](http://forum.kirupa.com/uploads/kirupa/4259/06aa84a18e27113d.gif)  
_figure 2_

This box model theory causes a problem when a DIV’s width is set as a percentage. Float’s will wrap around if their widths are set exactly as their intended width (_figure 2_). Right now, I’m using a ghetto solution: set one DIV to be 1% less than the intended width (_figure 1_). But as you can see, it’s not the ideal solution - I don’t get pixel perfect precision - see how the shadow juts out a little on the right?

Do any of you know how to prevent this wrapping while still have the DIVs’ widths’ be their intended width?