cornercorner
FeaturesPluginsDocs & SupportCommunityPartners

VwpFAQButtonWidthOnIE7

Revision as of 18:03, 5 November 2009 by Admin (Talk | contribs)
(diff) ← Older revision | Current revision (diff) | Newer revision → (diff)

Button: Why does button component render with incorrect width on IE7?

When displayed in IE7, the button component might be rendered with an incorrect width. This problem occurs when the button is placed using absolute positioning. For example, Netbeans Visual Web Pack uses absolute positioning to place components in Grid Layout Mode, and in such situation this problem could occur.

IE7 expects a value to be specified for the width of buttons. If a width attribute is not specified, the width is set to width:auto, which results in the button's width being set to the entire available width of the button's container element. For example, if the button style has left=130px then the button will start at 130px left and will expand to the width of the <body>.

Workarounds

There are several workarounds that can be used in Netbeans VWP to solve the problem.

  • Specify the width property for the button, or resize the button in the IDE to make the IDE assign a width to the button.
  • In the IDE, drop the button into a Group Panel to put the button inside a span tag. 
 In this case no need to set the positioning as IDE sets the positioning for Group Panel.

 Example: JSP code of Button inside Group Panel component 

<webuijsf:panelGroup binding="#{Page1.groupPanel1}" id="groupPanel1" 
                  style="position: absolute; left: 240px; top: 168px">
            <webuijsf:button binding="#{Page1.button1}" id="button1" text="Button"/>
  </webuijsf:panelGroup>
Retrieved from "http://wiki.netbeans.org/VwpFAQButtonWidthOnIE7"