function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Sandra OSandra O 

Alignment of text in visual force page

I have the following code, but when side bar collapsed - text aligns to the center.  When side bar extended - alignment is thrown off. Can someone help?
 
<apex:page standardController="Account" >

<apex:outputPanel style="font-size: 38px;background-color:yellow;width:100%;padding:550px;" rendered="{!account.Current_Engagement_Level__c =='At-Watch'}">At-Watch</apex:outputPanel>
    
<apex:outputPanel style="font-size: 38px;background-color:green;width:100%;padding:550px;" rendered="{!account.Current_Engagement_Level__c =='Engaged'}">Engaged</apex:outputPanel>

<apex:outputPanel style="font-size: 38px;background-color:red;width:100%;padding:550px;" rendered="{!account.Current_Engagement_Level__c =='At-Risk'}">At-Risk</apex:outputPanel>

</apex:page>

collapsed:
User-added image

not collapsed:
User-added image
LakshmanLakshman
Try to give padding in percent like
style="font-size: 38px;background-color:red;width:100%;padding-left: 20%;"


This would auto adjust the allignment.