IE9 strange line in asp:textbox - asp.net

So I have normal HTML table and inside it I have textbox.
<asp:TextBox runat="server" ID="txt1" CssClass="edit_mode_textbox" />
When I lower the textbox width, it's fine, but is there another solution?
This is only in IE9 and IE8.
Thanks!

There is nothing wrong with your asp:textbox or Table, its something wrong with background image you have set for this asp:textbox in your CSS. It may be repeating or you have been using 2 images in background. I am not certain about it unless you paste your CSS class edit_mode_textbox.
I hope this will answer your question, if yes please mark it as "answered".

apply css to remove some styles you do not need:
box-shadow:0;, border:none; and borde-radius:0;

Related

Styles are not set in IE10

I have two servers... one is of the TEST. Other.. of the live (productions). Both is of SAME OS and with the same hardware (32 bits), and same .NETs (4).
In one the LIVE, my styles attributes... uninclused.
Example:
<asp:textbox runat=server width=250 id=ctl32 />
In ALL browser, but the #10, render becomes:
style="width:250px;"
BUT in the ie10, doesn't set the style, is this a bug of .NET?
first you should avoid doing inline style settings. But I think you are setting an attribute, which is a deprecated way to apply the width to an element, it should be in a style rule. So in your css file (please avoid inline styles) create a class to set your with:
.myInput250{
width:250px;
}
and in your webforms textbox declaration reference it:
There seems to be an issue with the width attribute of an ASP.NET TextBox being recognized properly by Internet Explorer 10. Instead of using the Width attribute, try this:
<asp:textbox runat="server" id="ctl32" style="width: 250px;" />

Making a textbox unselectable

Hi i have a textbox which i am using as a counter to show how many characters are still allowed in another textbox. I have made it read only and its background transparent so that you cant tell it is a select box. The only problem is you can still click on it or tab to it. Is there a way to do this so it appears just like normal text and people cant click on it or tab to it?
If this is an Asp.Net Web Control set it's Enabled property to false
<asp:TextBox Enabled="false" />
If it is HTML you can do this:
<input type="text" disabled />
Just replace the input element with a span element or some other non-input element. This requires a trivial change to your JavaScript; you would assign to the innerHTML property of the element rather than value. Then the content will appear as normal text, and you can style it as desired.
you need some style with css and some trick with Jquery.
CSS
.readonly{
border:none;
background:#aaa;
}​
Jquery
$(".readonly").focus(function(){
$(this).blur();
});​
now just add class="readonly" to your textbox.
<asp:TextBox cssClass="readonly" />
check demo here .

Making Text box not editable

work on C# asp.net vs 05. I have a requirment, I have to fill text box with some data on gridview , which is coming from database and make it read-only
After that user can not enter any text on gridview template field. If I set textbox Enabled=false, then i lose text color, but i want to show text color. Just textbox to not be editable. I just want users to not be able to write anything in my textbox.
Isn't there a readonly property for the text box.
If then you can use
ReadOnly="true"
for the text box.
If you can use a label then I would prefer that one.
For wrapping contents inside a label you can use
word-wrap
word-wrap: break-word
Inside the properties choose your column field and in the properties.
Under Styles section
You can give a CssClass to the column.
If you specify CssClass as 'TextStyle'
the css looks like this
.TextStyle
{
color: #a9a9a9
}
In the color attribute give either the color name like 'red' or the hexcode like '#000000' for the text.
Enabled="false"
I'd use CSS to make a label look like a textbox.
Why does everyone insist on using an asp:label for this sort of thing? Just because it renders a <span> if you don't supply an AssociatedControlId?
You should look at using an asp:Panel or possibly an asp:Literal or asp:PlaceHolder for this as they will give you greater control over the output, and cleaner markup.
Panel would be better, as this will render the contents in a <div> rather than the PlaceHolder or Literal which won't add any extra markup.
The content you are putting in here is a semantic division, and so should really be marked up as such, and by default, <div>s are treated as a block display type, rather than as inline (<span>).
Here's a quick proof of concept I just knocked up.
<head runat="server">
<style>
.readTest
{
border: none;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox runat="server" Text="Do something" ReadOnly="true"
ID="txtOne" CssClass="readTest"></asp:TextBox>
</div>
</form>
</body>
</html>
Personally I would use a label, though you could write a custom control that renders a textbox or a label, depending on the state your app is in.
I'd prefer to write the text directly to the cell using a literal or String() output rather than using a control. It's a bit cleaner and will help minimize the amount of ViewState being written. Either that, or turn off ViewState for those controls being added.
Specify your CSS for the TextBox in the row created event of the GridView.

How do I change an ASP.NET listbox border from 3d to 1px solid?

By default the listbox in ASP.NET has a 3D border effect. I need to change that to Solid, 1 px, some color. Can this be done using css?
Thanks,
Atul
I think that for ie, certain properties of the select tag are not styleable. Something to do with the rendering of it tied to the OS. Not sure about ie8.
Here is something that styles borders, but its involved:
http://v2.easy-designs.net/articles/replaceSelect/
You can give your ListBox control a CSS class and then use that to define the border you like in your stylesheet.
<asp:ListBox id="YourListBox" CssClass="SomeClassName" rows="3" runat="server" />
Or you can use Asp.net Themes and Skins
For the border you can use a div as list box's parent:
CSS
.myborder {border: 1px solid blue;}
MARKUP
<div id="contents" runat="server" class="myborder">
<asp:ListBox ID="lbxItems" runat="server"></asp:ListBox>
</div>
Note: This solution only works for IE8+, not IE7.

RequiredFieldValidator - how to get rid of the default red font color

I can't seems to change the default color of the required field validator. In the source it is:
<span class="required">*</span>
<asp:RequiredFieldValidator ID="valReq_txtTracks" runat="server"
ControlToValidate="txtTracks"
Display="Dynamic" />
Here's what I have in my .skin file:
<asp:RequiredFieldValidator runat="server"
CssClass="error-text"
ErrorMessage="required" />
In the rendered source I see:
<span class="required">*</span>
<span id="ctl00_ctl00_cphContent_cphContent_valReq_txtTracks" class="error-text" style="color:Red;display:none;">required</span>
Notice the "style=color:Red;". That needs to go. I can't override it with a css-class because it's inline CSS. What should I do?
There is a RequiredFieldValidator.ForeColor property you can set to control the color. Note that if you want to set the color in CSS, then you need to set ForeColor="" to clear it on the control.
I know this an old thread, but I ran into this another day. It's kind of odd that setting style sheet does not override the text color of the validator. In my case, I had a whole bunch of different validators and extended validators that I wanted to override text color for, so instead of a theme and skin file, I created custom control adapter that handles rendering of BaseValidator control. Inside the rendering method, I just set ForeColor = Color.Empty. Hopefully this helps other people who ran into this situation and want to override text color for all kind of validators (required field, regular expression, compare,...).
Did you try to add style attribute with empty string in the skin file:
<asp:RequiredFieldValidator runat="server"
CssClass="error-text"
style=""
ErrorMessage="required" />
I read somewhere to use the !important tag in your css class to override the inline css...
Using !important seems to work fine in Firefox and IE, but for some reason not in Google Chrome... no biggie though, Chrome's share is still very low.
.form_error
{
font: bold 15px arial black,arial,verdana,helvetica !important;
color: #ff0000 !important;
}

Resources