Bootstrap Checkbox problem

[OldRod]

I'm trying to use a Bootstrap checkbox in a C# ASP.NET MVC generated web page.

The box is supposed to display the checkbox, with a label of "admin" to the right of it. But when it displays on the page, it looks like this:



I've been digging through Bootstrap .less files and just can't see where this problem is coming from. Anyone hit it before?

[Jackolantern]

It looks to me like there is an errant margin in there somewhere, maybe a left one.

Use Chrome Developer Tools to drill into what CSS rules are affecting it (Ctrl+Shift+J >> Elements tab >> select the markup of the checkbox >> Styles window on the right) and then work backwards into VS to find the rule where you can edit it.

[OldRod]

Apparently it's an issue with Bootstrap 3.2.0. I went back to 3.1.1 and the problem went away.

[Jackolantern]

Interesting. I would still assume it would be a CSS issue that could be resolved, though. But rolling-back and moving on may be your best bet.

[Chris]

Looking through CSS compiled from SCSS is a nightmare. You need to look at the SCSS source and use compass to compile it to CSS.

[OldRod]

Interesting. I would still assume it would be a CSS issue that could be resolved, though. But rolling-back and moving on may be your best bet.

I hit this while following along with some video tutorials, so a rollback is easiest. If it was my own project I'd probably dig into it and see what was up.

[hallsofvallhalla]

One of the BIGGEST pit falls to bootstrap is all the changes they have done. We use to use span but then they change them to col-md-4 and all that which destroyed sites. Everyone had to migrate. I still haven't migrated some of my sites. Doing it slowly. So I often stay away from the latest releases of bootstrap.

[Chris]

Refactoring Halls! In Netbeans you press ctrl+r and it does the rest for you

[hallsofvallhalla]

this week is one of those weeks where I answer everything in images.

[Jackolantern]

I have had those kinds of weeks before