Why are two text boxes on same page using different fonts?

Question

0.00/5 (No votes)

See more:

Hi,

I have two asp:textbox controls in the same <div> on a webpage. The first, which is single-line, correctly uses the font that I set in a site-wide stylesheet. The second, which is set to multi-line, changes the font to what looks like Times Roman.

If I use the F12 developer inspection tools in IE, the font is displayed as I would expect as the system-wide Helvetica, but on the screen it is Times. If I tick and untick the box next to this style, all the text on the screen switches between Helvetica and Times and back again as expected, but the text in the multi-line box always stays the same (Times).

Can anyone explain why this single textbox might be ignoring the site-wide setting, and also apparently ignoring what the developer tools believe its font should be?

Any help would be very much appreciated.

Kind wishes ~ Patrick

Posted 10-Jan-14 7:40am

Patrick Skelton

Add a Solution

Comments

Paramaa 10-Jan-14 14:10pm

Could you able to put your global used styles here

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Paramaa · Answer 1 · 2014-01-10T08:09:00

Solution 1

Hotcode the style inside the textbox like this

<asp:TextBox ID="TextBox1" runat="server" Text="sometext" TextMode="MultiLine" Style="font-family: Arial" />

If it is not working put your styles with not important specification.

XML

<style type="text/css">
                .font
                {
                    font-family: Arial !important;
                }
            </style>
            <asp:TextBox ID="TextBox1" runat="server" Text="sometext" TextMode="MultiLine" CssClass="font" />

Posted 10-Jan-14 8:09am

Paramaa

Comments

Patrick Skelton 10-Jan-14 14:31pm

Thanks for that. I wanted to avoid that for obvious reasons, and mainly because I don't like not understanding what is going on. The style works if I apply it directly to the textbox, but if I move it up just one level, to the enclosing div, it is ignored.

I notice that when the textbox is made multi-line its HTML becomes a textarea instead of an input. Time for a dig around the internet to see if this is a known issue. Anyone come across this? Seems monumentally pants to me.

Patrick Skelton 10-Jan-14 14:42pm

Mmm... I have found a few references to this problem. It seems the only solution that will work for IE8 and earlier is to set a site-wide font that includes the textarea HTML element. That seems to work okay. You can also set it to inhetit, but apparently older IE versions don't recognize this.

Anyway, thanks for the help.

- Patrick