Skip to content

Commit e1be8c1

Browse files
committed
Col Push/Pull/Offset value zero support
According to the Bootstrap documentation (and my own experience), column offsets must be reset to zero for other sizes if not used. "In addition to column clearing at responsive breakpoints, you may need to reset offsets, pushes, or pulls. See this in action in the grid example." For example `<Col xsOffset={2} xs={8} sm={4} md={4} lg={4}>...</Col>` when viewed in 'sm/md/lg' does not produce the expected result of having a column width of '4'. It looks only correct when viewed in 'xs'. The example would have to be rewritten as `<Col xs={8} xsOffset={2} sm={4} smOffset={0} md={4} mdOffset={0} lg={4} lgOffset={0}>...</Col>` to render correctly in all views. However, Offset/Push/Pull property values were ran through a "truthy" check in Col.jsx. So when the property value was `0` the column would not render. This has been fixed by doing a `>= 0` check instead which ensures that the property value is simply a non-negative number.
1 parent c759615 commit e1be8c1

File tree

1 file changed

+4
-4
lines changed

1 file changed

+4
-4
lines changed

src/Col.jsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -46,19 +46,19 @@ var Col = React.createClass({
4646

4747
prop = size + 'Offset';
4848
classPart = size + '-offset-';
49-
if (this.props[prop]) {
49+
if (this.props[prop] >= 0) {
5050
classes['col-' + classPart + this.props[prop]] = true;
5151
}
5252

5353
prop = size + 'Push';
5454
classPart = size + '-push-';
55-
if (this.props[prop]) {
55+
if (this.props[prop] >= 0) {
5656
classes['col-' + classPart + this.props[prop]] = true;
5757
}
5858

5959
prop = size + 'Pull';
6060
classPart = size + '-pull-';
61-
if (this.props[prop]) {
61+
if (this.props[prop] >= 0) {
6262
classes['col-' + classPart + this.props[prop]] = true;
6363
}
6464
}, this);
@@ -71,4 +71,4 @@ var Col = React.createClass({
7171
}
7272
});
7373

74-
module.exports = Col;
74+
module.exports = Col;

0 commit comments

Comments
 (0)