I can't seem to figure out how to get the checkbox and associated text to appear on one line. The text is very short so it doesn't seem to be a width issue.
I tried setting display:inline on the control but when it's rendered, a span is added around the input and label and that has the display:inline.
If I manually add the display:inline, using the resources view in Chrome, to the resulting label than it's fine. The problem is I don't know how to get the control to do this.
Thanks.
You want to have display:inline applied to the <label> element that ASP generates to hold the label text, not the control itself. So, for example:
<style type="text/css">
label { display: inline-block; }
</style>
<asp:CheckBox Text="This text appears on same line as checkbox" runat="server" />
Related
I want my JavaFX CheckBox to have no label.
Context: it's in the header of a TableColumn and it's (empahsis:) off-center.
I tried removing the label's text, but there's still some space on the right:
Next I tried changing the Content Display, but that didn't work either.
How do I get a CheckBox without a label or an extra space?
I figured it out!
SceneBuilder's CSS Analyzer (Ctrl + 6), shows me that CheckBoxes have some label padding there on the right side:
To fix it,
remove the checkbox's text
add the following CSS to your stylesheet or directly to the CheckBox
Stylesheet:
.no-label-checkbox {
-fx-label-padding: 0;
}
SceneBuilder:
I have a validator that has the associated error text set as below.
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" ValidationGroup="1" ControlToValidate="EmailTB"
Text="<div class='error-left'></div><div class='error-inner'>required</div>"
Display="Static" Width="100%" runat="server" SetFocusOnError="true" />
I put this validator on the third td of a tr. Th first two td are the name of the field and a textbox. The problem is that even if the error text is not shown, it seams to dstort the whole table layout by having width and height. I understand that ASP>NET uses javascript to make the text inside visible when the error text should be shown, but I don't like the fact that the layout is distorted by the height of a label which should not be activated. Look in the photo bellow:
Observations:
- This is the only validator in the form, this is why the tr for the email is so high (as the error-left class has this height)
Change the Display property to Dynamic - which will have the style set to "display: none;" until it's triggered.
Instead of including code even when there is no error, make it include code only if there is an error.
I would like to add div's and text to a specific DIV with ASP.NET, i have only found code which allowed controls to be added to the body but not to a specific Div.
I'm assuming you want to add controls and text to the div element server-side. If so, you can simply add runat and id attributes to the div and it will be available to you on the server.
For example, if you have a div on your page declared like this:
<div id="MyDiv" runat="server"></div>
You can add text, html content or other controls to it using the following:
MyDiv.InnerText = "some inner text"; // adding text
MyDiv.InnerHtml = "<div>inner html</div>"; // adding html
MyDiv.Controls.Add(new LiteralControl("a literal control")); // adding a control
Change the outer div to an <asp:Panel control. A Panel renders to html as a normal div, and will make it easy to add items from server code.
i have a filter panel with 5-6 combo boxes ajax control tool kit..
i want this filter panel to be visible false by default.. and toggle it(show/hide) on client click using java script
however when i have my filter panel as visible = false runat=server java script does not get the object
and if i do code behind.. filterpanel.attributes.add("style",display:none)
filterpanel.attributes.add("style",visibilty:hidden)
the combo box throws a runtime error..
i've searched on the net which says.. combo box is difficult to render inside a panel.. whose default property is initially false!
The problem is that the <select> elements have to be rendered (but not necessarily visible) in order to reliably access their dimension properties.
So display: none; won't work because the elements are not rendered, and visibility: hidden; will partially work because the elements are rendered, so space is allocated for them on the page, but hidden, so that space will remain empty.
A third solution is to render the container as usual, but make it absolutely positioned outside of the browser viewport:
filterPanel.Attributes.Add("style",
"position: fixed; left: -10000px; top: -10000px;");
That way, the panel and its contents won't be visible, but the size of the <select> elements will be properly computed.
On the client side, the formula to show the panel becomes:
document.getElementById("filterPanelClientID").style.position = "static";
And to hide it again:
document.getElementById("filterPanelClientID").style.position = "fixed";
You can test a jQuery-based implementation here.
The issue is that if you set Visible="false" on a server control, it won't render any of the HTML elements, including the combo boxes. Hiding the panel using the following is AJAX friendly:
<asp:Panel id="p" runat="server" style="display:none">
</asp:Panel>
Which will render a DIV and all your drop downs, but hide them from view, allowing you to toggle the div's visibility.
Don't apply the "display: none" to the panel, only "visibility: hidden":
filterpanel.Attributes.Add("style", "visibilty: hidden");
This will hide your panel (the <div> I suppose) but reserve the required space (and therefore will allow the dimension-related properties of the corresponding DOM element to have the right values).
Of course you'll see an empty spot but you could probably resolve this issue by playing with the styles of an element (maybe by nesting the panel inside another element and by applying styles to that element instead of doing that on the panel itself).
I have an asp:Menu control that has four different menu items in it. Each menu item has a graphic and a text description.
<Items>
<asp:MenuItem Text="New Authorization Form" Value="default.aspx" NavigateUrl="~/Default.aspx" ImageUrl="~/Images/TextPad.png"></asp:MenuItem>
<asp:MenuItem Text="Manage My Forms" Value="myrequests.aspx" NavigateUrl="~/MyRequests.aspx" ImageUrl="~/Images/Pencil.png"></asp:MenuItem>
</Items>
My problem is the icon and text have no padding between them and it just looks ugly! Does anyone know how I can force a bit of padding between the image and text of the menu item? I've looked at all of the attributes on the asp:Menu control, but I haven't been able to find one for this, but I may have just missed it.
I came up with an answer, but it's not what I was hoping for exactly. I added a style for img tags to my css like so:
img
{
padding-right: 5px;
}
I'm still a little bummed that there are no attributes within the asp:Menu control that allow you to specify the padding between the image and menu item text.
you could try creating a skin and then you could add a css class to and style it any way you want
the image item in the Menu is controlled by the class icon, modifying the properties of this class should solve the problem. I set padding-right to 5px to space image and text