Web Form Design Time and Run Time mismatch when you use Relative FontSize (316759)



The information in this article applies to:

  • Microsoft Visual Studio .NET (2002), Professional Edition
  • Microsoft Visual Studio .NET (2002), Enterprise Architect Edition
  • Microsoft Visual Studio .NET (2002), Enterprise Developer Edition
  • Microsoft Visual Studio .NET (2002), Academic Edition

This article was previously published under Q316759

SYMPTOMS

When you use Relative FontSize in a Web Form, and then view the Web Form in Microsoft Internet Explorer, the font size may appear different from the font size that you selected in Web Form Designer. Typically, the font size that appears in Web Form Designer is larger than the font size that appears in Internet Explorer. This behavior may cause display problems.

CAUSE

This behavior occurs because Web Form Designer sizes fonts differently from Internet Explorer.

RESOLUTION

This behavior occurs only when you use Relative FontSize; absolute font size is not affected. To avoid this behavior, use absolute font size settings, such as FONT-SIZE:12pt, instead of relative settings, such as FONT-SIZE:0.8em.

STATUS

This behavior is by design.

MORE INFORMATION

Steps to reproduce behavior

  1. In Visual Studio .NET, create a new project. Click Visual Basic Projects, and then click ASP .NET Web Application.
  2. Open Styles.css, and then make sure that the following code appears:
    BODY
    	{
    	    BACKGROUND-COLOR: white;
    	    FONT-FAMILY: Verdana, Helvetica, sans-serif;
    	    FONT-SIZE: 2em;
    	    FONT-WEIGHT: normal;
    	    LETTER-SPACING: normal;
    	    TEXT-TRANSFORM: none;
    	    WORD-SPACING: normal
    	}
    					
  3. Open WebForm1.aspx. In HTML View of the Web Form, paste the following sample code inside the <HEAD> tag:
    <link rel=stylesheet href=styles.css type=text/css>
    					
  4. Switch to Design View, and then drag a WebForms Label to the Web Form Designer. In Properties, set the Text property to Relative FontSize. Note that the font for the label appears in the Web Form Designer.
  5. Right-click WebForm1.aspx, and then click Set as Start Page to set the new form as the Start page.
  6. Press CTRL+F5 to run the project. Note that the font size in Internet Explorer appears as a smaller size than the font in Web Form Designer.
  7. Open Styles.css. Change the font size to the following absolute font size:
    FONT-SIZE:12pt;
    					
  8. On the View menu, click Refresh. The text label appears in the new font size in Web Form Designer.
  9. Run the project again. Note that the font size appears the same in Web Form Designer and in Internet Explorer.

REFERENCES

For more information about developing Web-based solutions for Microsoft Internet Explorer, visit the following Microsoft Web sites:

Modification Type:MajorLast Reviewed:4/21/2006
Keywords:kbvs2005doesnotapply kbvs2005swept kbprb KB316759 kbAudDeveloper