Overwite CSS inline style asp.net 4.0 Page in LookServer

Today, i got an issue after the look server is upgrade from 8.0 to 9.0, the asp.net engine had been changed from asp.net 2.0 to asp.net 4.0. the asp.net page had been render differently. those CSS classes still are available for the control. but the DataGrid which is rendered as a table had been use inline style to customize the look and they are overflow to cause the scroll bar enable. As the LookServer page only render window screen with ASP.net page. we had no control to modify those inline style customization.

Here is an example

<table style="z-index: 2; position: absolute; border-bottom-style: solid; border-bottom-color: #d4d0c8; border-right-style: solid; border-top-color: #808080; width: 811px; border-collapse: separate; border-top-style: solid; height: 266px; border-right-color: #d4d0c8; border-left-style: solid; border-left-color: #808080; cursor: default;" border="1" cellSpacing="0" cellPadding="0">

as the table had been specific the width in the inline style. this customization will cause the horizontal scroll bar to be enable since the table can't be fit into the frame with fixed width. if we change or overwrite the width with specific pixel to 100 percentage. then the table will automatically resize based on the size of host frame. as the result the table fit into the frame without any scroll bar.

the solution to solve the table overflow issue is

table[style]
{
   width:100% !important;
}

table is the HTML control that CSS will apply to.
Style is the element of HTML control that CSS will apply.
Width is the attribute that being apply.
!important is the rule that always apply


After i put the above rule in the CSS. the table overflow issue is fixed.