Join Jen Kramer for an in-depth discussion in this video Creating and formatting radio buttons, part of Bootstrap 3: Adding Interactivity to Your Site.
- View Offline
…So the next thing I'd like to concentrate on is…the question, what kind of room are you interested in?…This is very, very hard to read, because we…have all these radio buttons all on one line.…And it's hard to tell what radio button goes with which option here.…So I'd like to change the markup, so that it…will ask, what kind of room are you interested in?…And then, after that, it will list, each one of these options on its own line.…There's only four of them, so let's list them vertically.…So I'm going to hop into sublime text here,…and we are starting here around line 53.…
And, that is the div with the class…of formgroup, that wraps around this entire question.…So where we're going to start here is at line 54, where we have the label tag.…And we are going to add a class of control-label.…So this is a kind of styling that is…going to help us style this question on the webpage.…Then for each one of these radio buttons, what we are going to do…is we are going to wrap this in a div with a class of radio.…So again this is pertaining mostly to styling.…
Need help getting Bootstrap up and running? Check out Bootstrap 3 Essential Training.
- Installing Bootstrap 3, Sublime Text 2, and jQuery
- Planning the thumbnail gallery
- Creating modal windows
- Creating an image carousel
- Linking images and adding captions
- Changing the carousel rotation
- Laying out and styling a contact form