+ Start a Discussion
nivyajnivyaj 

CSS isn't being applied uniformly across browsers

I'm new to web development, but I'm running into a bug. Below is more or less my code. when I use the attribute: dataStyle="text-align:left; width: 30%; max-width: 30%;" it's not being consistently rendrered in IE and firefox. it works in IE but in FF the labels and input fields are not lining up. HALP!

 

 

<apex:pageblockSection>

     <apex:pageblockSection columns ="1">
        <apex:pageblockSectionitem dataStyle="text-align:left; width: 30%; max-width: 30%;"
            <apex:outputLabel value="Field 1" />
            <apex:inputField value="{!field_1}"
        </apex:pageblockSectionitem>
      </apex:pageblockSection>

     <apex:pageblockSection columns ="1">
        <apex:pageblockSectionitem dataStyle="text-align:left; width: 30%; max-width: 30%;"
            <apex:outputLabel value="Field 2" />
            <apex:inputField value="{!field_2}"
        </apex:pageblockSectionitem>
      </apex:pageblockSection>

</apex:pageblockSection>