This question already has answers here:
How can I change the size of a Bootstrap checkbox?
(10 answers)
Closed 3 years ago.
I am creating a mobile-targeted page using Twitter Bootstrap. Since it's mobile-targeted, I'd like all my form UI elements to be nice and big.
The input-lg class achieves this nicely for ordinary text inputs. But it has no effect on radio buttons or checkboxes, and I don't see an equivalent class for them mentioned in the docs.
How should I achieve the same result for checkboxes and radio buttons?
It is possible via CSS, you can add the class "form-control" to your checkbox or radio button and it will become bigger; input-* classes will not affect the size of the control, only with input-sm you can see a little difference.
Related
This question already has answers here:
How to style the option of an html "select" element?
(21 answers)
How do I style a <select> dropdown with only CSS?
(25 answers)
Closed last month.
Usually when you create a <select> option field and use color to change the color.
This applies only to when the dropdown is clicked upon and is in an active state.
Is it actually possible to change the color of the option that is selected? So if you look at the code, only make the option Apple red that is selected (when another fruit is selected, make that red). However, the colors of the text need to black in the dropdown.
select option {
color: red;
}
<select>
<option>Apple</option>
<option>Banana</option>
<option>Peach</option>
<option>Strawberry</option>
<option>Pineapple</option>
</select>
Since this component is a re-used one, I can not edit the HTML structure of it.
I tried to give the options a color, but this resulted in changed all of the option in the active dropdown and not the item selected.
I also looked up other topics and answers in here but every provided code also changes the color in the active dropdown state or they modify the HTML.
Hi Have a grid implemented third-party library AG-Grid. This grid has editable feature to edit rows.
And while editing I am rendering Bootstrap dropdown to update value of Year column as shown in below example:
Editable Grid - Dropdown Issue
When I click on the dropdown its li elements are not displaying properly as it is hidden behind the grid.
Is there any solution for this ?
This is a bit old, but for anyone else looking:
If you set the isPopup() function on your cell editor to return true you shouldn't have to fight with the CSS of the component. Allows the dropdown to render over the other cells without any CSS edits.
If you want your editor to appear in a popup (such as a dropdown
list), then you can have it appear in a popup. The popup will appear
over the cell, however it will not change the contents of the cell.
Behind the popup the cell will remain intact until after editing is
finished which will result in the cell being refreshed.
Started learning Twitter Bootstrap a couple days ago and in form-design they use form-group but from some examples I have seen for example each label and its text box is inside one form-group and from some other examples I have seen they put multiple labels and their text boxes in one form-group.
So my question is what makes them know and decide which way to wrap in form-group?
Wrap labels and controls in .form-group for optimum spacing. - Bootstrap Documentation
It just adds a bottom margin to help space out your controls. I find that in most cases you would want to use them. The only time I can think of that you might consider not using them is if the form you're styling requires a lot of custom positioning or spacing.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
how to handle long text in dropdownlist control in ASP.NET
I use VS2010, C# to develop ASP.NET web apps, sometimes my drop down contains long items which makes my combos big, is there any way that I can break large items into 2 (or more lines), so that my combo size is fixed?
You can not make it multiline. Instead you can make dropdown control fixed width and its dropdown(items) resize according to the content length
Try using CSS to add a fixed width to your dropdown, like:
select {width: 150px}
Whilst the dropdown itself will be of a fixed width and may not show all of the text, the option elements should expand to the width of the widest element.
Default ComboBox behavior is a little bit too browser dependant. If you want to get an uniform and customized appearance you may use a jQuery plug-in (I assume you're using jQuery). You can start searching from this list.
You can specify a cssClass for the Combo Box and then specify widths/heights for the <li> items.
Look at the different options for a ComboBox here: http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/ComboBox/ComboBox.aspx
It is possible to bold some part of label in standard Button? example:
ICON - normal_normal_text BOLD_BOLD_text
Thanks for help :)
I don't think you can do this with a standard label, but FlexLib contains a CanvasButton component (http://flexlib.googlecode.com/svn/trunk/docs/flexlib/controls/CanvasButton.html) that allows you to add multiple children to a button that would work well to have two labels styled differently, or to better control the styling in a single label.
You're probably better off using a Text or a Label and skinning it look like a button. Each of those has an .htmlText property which will take rudimentary tags like <b></b> and <i></i>, etc. Remember to set the .buttonMode and .useHandCursor properties to true and .mouseChildren to false for best button simulation.