Bootstrap Tutorial
Why Stack Overflow recommends it
Stack Overflow users link it when a questioner needs a quick introduction to Bootstrap for building responsive or mobile-friendly pages.
Recommended by 2 people across 2 different months, 2017 to 2018.
What it is
A one-hour Bootstrap 3 tutorial by Derek Banas that walks through the framework's main features in a single sitting: grid and responsive layouts, buttons, tables, carousels, dropdowns, nav bars, pagination, progress bars and list groups. It is a code-along crash course with a downloadable cheat sheet.
What people said
Recommends Sergnio · 2017-02 · Stack Overflow · on “How would one go about styling HTML elements in a CSS file for mobile viewport”
If I understand you correctly, you want to create a webpage that's also mobile friendly. Twitter Bootstrap [LINK] is the most popular framework for achieving this, and is used in almost every new web application. I would suggest watching some Bootstrap tutorials [this video] on this. Derek Banas has really good introductory tutorials to show you how different languages/frameworks interact. I wouldn't recommend him for an in depth tutorial on understanding all the in-and-outs of the topics of his video, but he's amazing at showing what the particular topic of the video is excellent at.
Recommends Naren Murali · 2017-09 · Stack Overflow · on “stylize input select [options next to options]”
My suggestion would be search the internet for creating a toggle switch, I'd suggest using bootstrap switch [LINK] , if you are not familiar with bootstrap go for learning bootstrap online! Refer this online series [this video]
Cites Tcraw · 2018-01 · Stack Overflow · on “Bootstrap : how to move label to the right of the input in form-horizontal?”
Solution I've edited your code so it shows the labels and inputs inline: Fiddle [LINK] . Explanation 1. Use the Bootstrap Grid to Your Advantage! The first issue I see with your markup is that your sibling nodes' (Input Div and Label) classes do not add up to 12. In Bootstrap, all related html nodes (tags) must add up to 12 if you would like them to equally fill the Bootstrap grid. In the Fiddle, you will see that I edited your Label and Input Div to match this rule (4 + 8 = 12): <!-- Text input--> <div class="form-group"> <label class="col-xs-4 col-sm-4 col-md-4 control-label" for="textinput">Left Align</label> <div class="col-xs-8 col-sm-8 col-md-8"> <input id="textinput" name="textinput"