i added a asp.net textbox into my webpage and cover it with css like shown below
<tr>
<td id="policeprofileachievement" colspan="2" align="center">
<b>Achievement :
<asp:TextBox ID="txtAchievement" runat="server" ReadOnly="True" TextMode="MultiLine"></asp:TextBox>
<br />
</td>
</tr>
In my source code i have added a width for the textbox. But in my css, i added this but it didnt resize my textbox width
#policeprofileachievement [type="text"] {
position:absolute;
margin-top:250%;
left:0%;
width:150px;
}
AND/OR
I removed the policeprofileachievement from my CSS and added this ( which is recommended by many )
#txtAchievement{
position:absolute;
margin-top:250%;
left:0%;
width:150px;
}
But there doesn't seem to have any changes on my textbox size either
Is there any other way to resize my textbox size?
Regards
.txtbox
{
position:absolute;
margin-top:250%;
left:0%;
width:150px;
}
#txtAchievement{
position:absolute;
margin-top:250%;
left:0%;
width:150px;
}
Why dont you simply create a css class and add it to your textbox's cssclass property, like so..
.tb_style
{
position:absolute;
margin-top:250%;
left:0%;
width:150px;
}
THEN ADD IT TO YOUR TEXTBOX LIKE SO
<asp:TextBox ID="txtAchievement" runat="server" ReadOnly="True" TextMode="MultiLine" Height="150px" Width="500px" CssClass="tb_style"></asp:TextBox>
This will also allow you to add same style to other TextBox(s) and create a constant look and feel to the webpage with minimal effort
Make sure you dont write some rule inline to your textbox thats also there in the cssclass...cuz your inline rule will override the rule in class.
The CSS selector #policeprofileachievement[type="text"] means "a tag with ID policeprofileachievement and type=text", which selects nothing because the td with id=policeprofileachievement has no type attribute.
You can use #txtAchievement to select the textbox because it has an id (no need to specify [type="text"]).
Alternatively, if for some reason you need to select multiple text input fields under policeprofileachievement, you could do
#policeprofileachievement input[type="text"]
CSS means cascading style sheet. So your css code block renders second but the text box that you have written already has a width component which will be 'cascaded' by the css you have written. Remove the css width property and your code should work.
With your present code try giving width below 150px. That may work.
Try this:
put space between #policeprofileachievement and [type="text"]
means style for inner all [type="text"] in #policeprofileachievement
#policeprofileachievement [type="text"] {
position:absolute;
top:250%;
left:0%;
width:150px;
}
Try this.It should work..For me its working..
.aspx
<asp:TextBox ID="txtAchievement" runat="server" ReadOnly="True" TextMode="MultiLine"> </asp:TextBox>
CSS
<style>
#txtAchievement
{
width:50px;
}
</style>
Related
I use the AjaxFileUpload control in my applilcation, but each time I choose file (or drag) the control expend its width beacuse it has to show the file type information.
I tired to assign it with a css class and setting the width, but it still changes.
this is the pic before and after I choose a file:
this is my aspx part:
<tr>
<td style = "text-align:right;">
<asp:AjaxFileUpload ID="AjaxFileUpload1" OnUploadComplete="AjaxFileUpload1_UploadComplete" runat="server" ThrobberID="myThrobber" MaximumNumberOfFiles="1" AllowedFileTypes="pdf,doc,docx,ppt,pptx,xls,xlsx,jpg,jpeg" CssClass="uploader"/>
</td>
</tr>
the class:
.uploader
{
width:300px;
}
What if you put the uploader in a Div with that width set? Can you force it with the parent?
I am applying an image to a text box as follows
<asp:TextBox ID="TextBox1" runat="server" Style="background-image: url('Popup(Images)/Solved.png');"
BorderStyle="None" />
This is giving the following result
I tried it applying no-repeat but the image is not getting displayed. can any one help me. Why I am using Text box is the only control which gray out when its property set to disabled or if any one having any idea how to gray out image button with displaying image give me that solution
input.textbox
{
background-image: url('Popup(Images)/Solved.png');
background-repeat:no-repeat;
}
<asp:TextBox ID="TextBox1" runat="server" CssClass="textbox" BorderStyle="None" />
You can do it like this
<asp:TextBox ID="TextBox1" runat="server" Style="background: #ffffff url('Popup(Images)/Solved.png') no-repeat center center;" BorderStyle="None" />
When using the shorthand property the order of the property values are:
background-color
background-image
background-repeat
background-attachment
background-position
or if any one having any idea how to gray out image button with displaying image give me that solution
You can use a custom style to a disabled input type, as shown in this sample: http://jsfiddle.net/964dL/4/
give background-repeat property in style of your textbox
background-repeat:no-repeat;
style="background: #fff url(images/solved.png) no-repeat 0px 5px;"
I've one asp.net page and I want to load text into the textArea control which is in aspx page from into a variable in code behind (C#):
Code behind:
System.Web.UI.HtmlControls.HtmlTextArea Output1 =
(System.Web.UI.HtmlControls.HtmlTextArea)(FindControl("textarea1"));
Output1.Value = Output.ToString();
ASP:
<div style ="width: 78%; float: right; height: 85px; display: block;"
class="message_text_box_left">
<textarea id="textarea1" name="textarea1" cols="30" rows="3"
class="message_text_box" title="Share your Idias here..."
tabindex="1" onkeyup="addrow_fun();"></textarea>
</div>
but it is giving error like
Object reference not set to an instance of an object.
You should add the
runat="server"
attribute to the text area.
Or, preferable you should use the TextBox ASP.NET control and set the TextMode property to TextBoxMode.MultiLine. Example follows:
Code behind:
Output1.Text = Output.ToString();
ASP:
<div style ="width: 78%; float: right; height: 85px; display: block;"
class="message_text_box_left">
<asp:TextBox ID="Output1" Rows="3"
CssClass="message_text_box" ToolTip="Share your ideas here..."
TextMode="MultiLine" />
</div>
Add runat="server" in *.aspx file. Use Innertext property to set the text value.
E.g.
htmlTexarea.InnerHtml = "sample"
Add runat="server" to your control
Check your .designer.cs or codebehind .cs file for textarea/textbox declaration and fix it.
Do not use FindControl function (it is not recursive), get control by ID. textarea1.Value = xxx;
Try casting to HTML generic control and set it's value or change it to use an asp textbox textmode= multiline
If you add the runat="server" attribute you should be able to use the textarea1.innerText directly.
Add runat="server" and get value with InnerText from code behind
I've searched Google and cannot find anyway to remove the bullet points from the bulleted list control. I only want a list with the text only no numbers, bullet points or letters. How can I do this?
If i cant do this is there an alternative to this perhaps another control i should look into? I need to be able to get the values so I'm binding data to this control.
Heres the html just in case-
<ItemTemplate>
<asp:Table ID="comparator_tbl" runat="server" CssClass="plainTable">
<asp:TableRow>
<asp:TableCell ID="demographic_cell" runat="server" HorizontalAlign="Right">
<asp:BulletedList ID="demographicComparator_lst" runat="server">
</asp:BulletedList>
</asp:TableCell>
<asp:TableCell ID="detail_cell" runat="server" HorizontalAlign="left">
<asp:BulletedList ID="comparator_lst" runat="server">
</asp:BulletedList>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</ItemTemplate>
Bullet list control is used to show items as a bulleted list. if you don't need bullets the you should use simple list control... I think you will have to resort to setting this with CSS since the BulletStyle property of the BulletedList doesn't support a blank style.
<asp:BulletedList ID="BulletedList1" runat="server" style="list-style-type:none;" >
</asp:BulletedList>
Hope this helps.
You can't remove in asp.net. You need to specify CssClass property for it with some style class and it should have following styles:
.bullet-list { list-style: none; padding: 0; margin: 0;}
This is realy easy to do using CSS:
#ID-Of-Your-List ul { list-style-type: none; }
The bulleted list is finally rendered as <UL><LI>...</LI>...</UL> in the browser and you can use CSS to handle this.
You can set the nonbulleted style to the list like this:
If the id of the list is #BulletLessList set the CSS entry as
#BulletLessList ul { list-style-type: none; }
If you wish to set the same style in multiple lists, you can set the css class to all the lists and set the css as
.BulletLessList ul { list-style-type: none; }
Bullet list control is used to show items as a bulleted list. if you don't need bullets the you should use simple list control... I think you will have to resort to setting this with CSS since the BulletStyle property of the BulletedList doesn't support a blank style.
I have a checkboxlist on aspx
<asp:CheckBoxList ID="cblCalendarFilter" runat="server" />
I add the listItems from code behind.
newCkItm = new ListItem();
newCkItm.Text = childrenFoldersData[i].Description.Trim();
newCkItm.Value = childrenFoldersData[i].Id.ToString().Trim();
newCkItm.Selected = true;
I can add the background of the ListItem by
newCkItm.Attributes.Add("style", "background-color:Red;");
The colors will be different from one item to another and the name of the item will also be different. So, the problem is the background color is only covering the text length. The background color is not aligned for all Items. I checked with the inspector and found out that..
The background color style is applying to <span> surrounding the text
All spans are inside the <td>.
I am wondering if there is a way to apply that style to <td> without much effort. I'd rather not use jquery and javascript by searching the name.
Is there any way to do that??
I have tried and found this solution & it worked for me.
Just try to give padding-right
for example:
newCkItm.Attributes.Add("style", "background-color:Red;padding-right:30px");
Instead of adding a style attribute to each item, and because you mentioned each item needs a different background colour, I'd add an id attribute:
newCkItm.Attributes.Add("id", "alpha");
That way you can keep all your styles separate from your code and not have to recompile, etc. every time you need to tweak the CSS.
With the <asp:CheckBoxList /> the CSS itself would look something like this:
#cblCalendarFilter {
border:none;
border-collapse:collapse;
}
#cblCalendarFilter td {
padding:0;
}
#cblCalendarFilter span {
display:block;
padding:2px;
}
#cblCalendarFilter #alpha {
background:red;
}
#cblCalendarFilter #beta {
background:yellow;
}
Hopefully making the span block-level will fix the issue you had with the background colour only covering the text length.
How about if you use a Repeater which has tr/td with CheckBox inside it and do the logic on the ItemDataBound event where you can retrieve the td:
<table>
<asp:Repeater ID="rpt" runat="server" OnItemDataBound="rpt_ItemDataBound">
<ItemTemplate>
<tr>
<td id="myTd" runat="server">
<asp:CheckBox runat="server" ID="myCheckBox" />
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
I think there is no other way, you have to individually access the element and assign the css to items. I tend to use foreach loop, access the item and add attributes. TBH, I would stay with checkboxlist compared to repeater, unless I need some extra functionality