I have an asp.net form that is styled with CSS. I am trying to input a string into a textbox through the code behind the asp form.
Problem: All text that goes into any asp.net textbox is centered and in one line Figure 1
Attempted solution: Created a class in my CSS form and changed margins and alignments. Surrounded the textbox in a div with the class
Question: How do I revert the CSS back so all ASP.NET textbox's are back to normal
If you add class attribute to the form element then the given styles apply for all the elements within that form element.
Instead of doing that if you want to apply style for only one element add id attribute to the element and give styles.
Ex:
.form {
text-align: center;
}
above code apply center text for all elements.
<input id="txtBxId " value="Hello World!"/>
#txtBxId {
text-align: center;
color: red;
}
but if you do like this it will apply for single element
you can use textbox in centered text with 2 ways :
1) tag
<center>
<asp:TextBox ID='text'>
</center>
2) Input :
<html>
<style>
#txtBxId {
text-align: center;
color: red;
}
</style>
<body>
<input id="txtBxId " value="Hello World!"/>
</body>
</html>
In my code, I want to add a repeating-linear-gradient to my div from my code behind. At the moment, I am trying to set this by the following code:
_div.Style.Add("background-image", "repeating-linear-gradient(90deg,rgba(0,100,200,.5),rgba(0,100,200,.5) 1px,transparent 1px,transparent 1px,rgba(0,100,200,.5) 1px)");
But the code has no effect on the div itself. I have been able to change the display with similar code:
_div.Style.Add("display", "inherit");
Any help would be appreciated.
Edit
Here is the HTML for the div
<div id="_div" runat="server">
<asp:Label ID="_Label" runat="server"></asp:Label>
</div>
Here is the CSS for the div
#output_div {
display: none;
padding-top: 2%;
padding-bottom: 2%;
width: 50%;
margin: 0 auto;
/*Below line works, but would like to set it dynamically on the server side*/
/* background-image: repeating-linear-gradient(90deg, rgba(0,100,200,.3), rgba(0,100,200,.3) 1px, transparent 1px, transparent 1px, rgba(0,100,200,.3) 1px);*/
background-size: 4px 4px;
}
Give it a try with following approach,
_div.Attributes.Add("style", "background-image: repeating-linear-gradient(90deg,rgba(0,100,200,.5),rgba(0,100,200,.5) 1px,transparent 1px,transparent 1px,rgba(0,100,200,.5) 1px)");
That way, style attribute will be rendered to the output HTML.
Update
You can also try adding a specific CSS class.
.myBackgroundImg {
background-image: repeating-linear-gradient(90deg, rgba(0,100,200,.3), rgba(0,100,200,.3) 1px, transparent 1px, transparent 1px, rgba(0,100,200,.3) 1px);
}
Then you can apply it in the code behind.
_div.Attributes.Add("class", "myBackgroundImg");
Try the below line -
_div.Style.Add("background", "repeating-linear-gradient(90deg, rgba(0,100,200,.5) , rgba(0,100,200,.5) 1px,transparent 1px,transparent 1px,rgba(0,100,200,.5) 1px)")
You may have to use ScriptManager & UpdatePanel also.
I am creating a treeview in asp.net and able to bind treeview perfectly.But my tree view is looks the following image which is as default layout of treeview control.
I am using the following code
$(document).ready(function () {
$("div[id=tvCategories] input[type=checkbox]").click(function () {
$(this).closest('table').next('div').find('input[type=checkbox]').attr('checked', this.checked);
$(this).parents('div').each(function (index) {
if ($(this).find('input[type=checkbox]:checkbox').length > 0) {
$(this).prev('table').find('input[type=checkbox]').attr('checked', true);
}
});
});
});
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TreeView ID="tvCategories" NodeIndent="25" OnTreeNodeDataBound="tvCategories_TreeNodeDataBound" Style="font-family: 'Lato', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 5px; margin-bottom: 5px; margin-left: 50px; color: Black; font-size: 12px"
runat="server" ShowCheckBoxes="All">
</asp:TreeView>
</ContentTemplate>
</asp:UpdatePanel>
But I want need the following layout. which I am not able to create this
Please help me to create this.Is Trieeview control is match for this layout or bind it by other way ?
What you are intending to do is not possible to elegantly do because of the default HTML that is rendered by the TreeView control (Table -> Div -> Table, Div etc).
You could however use a CSS control adaptor to change the way the default HTML is rendered (Ul -> Li -> Ul -> Li). The HTML that is rendered using this approach is nested and therefore can be targeted using CSS to attain the look you are seeking to achieve. You may have to rewrite some of your code and create a custom implementation.
See http://samples.asp.net/cssadapters/TreeView.aspx for code examples.
I hope that helps!
How do I customize an asp:Button class?
This is like this proble: How to set css style to asp.net button? but not really since the button is inherited from a cs class.
I have this bit of code in an ASPX file:
<div class="buttonContainer" style="clear:both;width:100%;text-align:left">
<asp:Button ID="btnProceed" runat="server" Text="Next" OnClick="ProceedButton_Clicked" Enabled="true" />
</div>
So, if I want to make the button bigger or bolder text, how would I do it?
btnProceed is defined in a .cs file like this:
protected global::System.Web.UI.WebControls.Button btnProceed;
So, is there some way I can inherit a System.Web.UI.WebControls.Button class and change the font size?
All your server controls are ultimately going to render some HTML markup to the browser. So Apply a CSS class to your button and style it the way you want. You can use the CssClass property to set it.
<asp:Button ID="btnProceed" runat="server" Text="Hi" CssClass="yourClass" />
And put this style in your css file which is being included in your aspx page.
.yourClass
{
font-size:72px;
font-weight:bold;
}
You could be able to customize any style for your button with this
.buttonContainer input
{
font-size: 14px;
font-weight: bold;
/**** ETC ***** /
}
you can set Font Size at server-side by using btnProceed.Font.Size = FontUnit.Point(50);
I have an ASP.net page with dynamic content that are inside Controls, some of them custom controls and some of them regular ASP.net controls.
Is there a way to get those controls inside a Marquee? maybe an HTML Marquee? These controls are mostly built in this sense:
sometext
sometext
sometext
etc.
Thanks!
You should look into using jQuery. The Marquee tag is deprecated and doesn't work in all browsers.
I ended up doing this:
<asp:Literal id="Literal1" text="<marquee>"></asp:Literal>
some controls
<asp:Literal id="Literal2" text=</marquee>"></asp:Literal>
Which is very similar to the solution Luke gave, but you can't just use as regular HTML in an asp.net page.
Literal marquee = new Literal();
marquee.Text = "<marquee style=color:#663300; font-weight:700; font-size:medium; width:877px; height:22px; margin-top:0px; position:relative; top:-3px; left:-73px; margin-left:0px;> Welcome ... >To Narsingham Page </marquee>";
this.Controls.Add(marquee);
Put the above code under Page_Load in your project then you can get want you want.
I am trying to use a marquee tag in my project's master page.
here is the code. gets the obvious error, googled it, but unable to find a work around.
<pre style="font-family: Andale Mono, Lucida Console, Monaco, fixed, monospace; color: #000000; background-color: #eee;font-size: 12px;border: 1px dashed #999999;line-height: 14px;padding: 5px; overflow: auto; width: 100%"><code><marquee style="color:#663300; font-weight:700; font-size:medium; width:877px; height:22px;
margin-top:0px; position:relative; top:-3px; left:-73px; margin-left:0px;"> Welcome ... >To Narsingham Page
</marquee>
</pre>
is there any way, i can use the same marquee in xhtml1.0, in my vs2010 project. i tried luke's method but it does not work this way. Is it necessary to use jquery in this senario . i find this html control easy, as i donot have much grip in jquery.
regs;\j
have you tried:
<marquee> <asp:YourUserControl ... /> </marquee>