Commit a97b9c11 authored by Mark Otto's avatar Mark Otto

in responsive layouts <767px, ensure inputs are not larger than 100% with...

in responsive layouts <767px, ensure inputs are not larger than 100% with box-sizing and a max-width
parent bf6cdff8
...@@ -168,6 +168,16 @@ ...@@ -168,6 +168,16 @@
width: auto; width: auto;
margin: 0; margin: 0;
} }
input,
textarea,
select,
.uneditable-input {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
max-width: 100%;
}
} }
@media (min-width: 768px) and (max-width: 979px) { @media (min-width: 768px) and (max-width: 979px) {
.row { .row {
......
...@@ -3678,6 +3678,7 @@ a.thumbnail:hover { ...@@ -3678,6 +3678,7 @@ a.thumbnail:hover {
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
-webkit-transition: width 0.6s ease; -webkit-transition: width 0.6s ease;
-moz-transition: width 0.6s ease; -moz-transition: width 0.6s ease;
......
...@@ -252,6 +252,7 @@ ...@@ -252,6 +252,7 @@
.box-sizing(@boxmodel) { .box-sizing(@boxmodel) {
-webkit-box-sizing: @boxmodel; -webkit-box-sizing: @boxmodel;
-moz-box-sizing: @boxmodel; -moz-box-sizing: @boxmodel;
-ms-box-sizing: @boxmodel;
box-sizing: @boxmodel; box-sizing: @boxmodel;
} }
......
...@@ -188,6 +188,17 @@ ...@@ -188,6 +188,17 @@
width: auto; width: auto;
margin: 0; margin: 0;
} }
// FORM FIELDS
// -----------
// Make them behave like divs
input,
textarea,
select,
.uneditable-input {
.box-sizing(border-box);
max-width: 100%;
}
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment