0

After reading this post: Using box-sizing : border-box with Twitter Bootstrap 2.x, can we do it easily without breaking everything?

I've decided I want to try out box-sizing with a sass repo I've downloaded here: https://github.com/thomas-mcdonald/bootstrap-sass.

I've tried adding the following:

* {
-moz-box-sizing: border-box; 
-webkit-box-sizing: border-box; 
box-sizing: border-box; 
 }

This works great, but it screws up my input forms height. Reading the above post comments on using box-sizing content on input forms. But obviously this is in less not sass:

*, *:before, *:after {
.box-sizing(border-box);
}

input {
.box-sizing(content-box);
}

Would anyone know how to get this working so my input forms are being squished?

Community
  • 1
  • 1
rowefx
  • 265
  • 2
  • 9
  • 26
  • border-box makes it so the padding doesn't change the size of the element, whats the issue, how about either a http://jsfiddle.net or 2 screenshots of before and after would be helpful – iConnor Jun 06 '13 at 12:05

1 Answers1

0

you can use it within sass file also- try below code

*
  &:before, &:after     
     +box-sizing(border-box)


input
  +box-sizing(content-box)

Less code is now converted into a sass code. If Less code is working, then This sass code will definitely work for you

Chandrakant
  • 1,971
  • 1
  • 14
  • 33