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
Merry SMerry S 

Question - why would my table render differently when using showheader=false?

I have a table that shows icons of account statuses - when I set the VFpage to showheader=false it changes how that table is displayed (this also happens when viewing on the force.com sites even with showheader=true) - see stackexchange question since I cannot post pics here - can someone help me understand why?

 

<apex:page StandardController="Account" extensions="ColumnControllerExt" tabstyle="account">
<head>
    <script type="text/javascript">
// Popup window code
function newPopup(url) {
    popupWindow = window.open(
        url,'popUpWindow','height=700,width=800,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes')
}
</script>

<style type="text/css">
#rowInfo,#rows{
        padding:5px;
    text-align:center;
    background-color:#f8f8f8;
    border:solid 2px #236fbd;
}
#rowInfo { 
    width:50px;
    display:bold; 
}
table
{
border-collapse:collapse;
table-layout: fixed;
}	
 </style>
    <style type="text/css">
    <!--
    body {
      color:#000000;
      background-color:#FFFFFF;
	    }
    a  { color:#0000FF; }
    a:visited { color:#800080; }
    a:hover { color:#008000; }
    a:active { color:#FF0000; }
    -->
	div#wrapperHeader div#header {
 width:1000px;
 height:200px;
 margin:0 auto;
}

div#wrapperHeader div#header img {
 width:; /* the width of the logo image */
 height:; /* the height of the logo image */
 margin:0 auto;
}
    </style>
	<div id="wrapperHeader">
 <div id="header">
  <img src="https://c.na13.content.force.com/servlet/servlet.ImageServer?id=015a0000002WenZ&oid=00D3000000003Hx&lastMod=1375828250000" alt="logo" />
 
    <center><font size="3"><a href="/apex/anyCustomerEmployeeTimeList">List View</a></font></center>
        </div> 
</div>
</head>
<body>

<table width="100%">
<tr>
<td width="80%" valign="top">
        <apex:outputPanel >
            <apex:form >
                <apex:actionFunction action="{!setHoveredAccount}" name="setDetailId" reRender="accountDetail" status="detailStatus">
                    <apex:param name="detailId" value="" assignTo="{!hoveredAccount}"/>
                </apex:actionFunction>
                <table>
                     <tr align="center">
                         <td><a href="JavaScript&colon;newPopup ('http://mc-www.mainman.dcs/dcs/main/index.cfm?event=showFile&ID=1D833C4A02E0D046BE&static=false');" ><img src="/img/icon/documents24.png" title="Key (WIG) RASCI"/></a></td>
                              
                 <td><a href="#"><img src="/img/icon/documents24.png" title="Acitve Project RASCI"/></a></td>  
                     <td><a href="#"><img src="/img/icon/documents24.png" title="Active Opportunity > $50K RASCI"/></a></td>  
                         <td><a href="#"><img src="/img/icon/documents24.png" title="Partner-Managed RASCI"/></a></td>  
                             <td><a href="#"><img src="/img/icon/documents24.png" title="TAM-Managed RASCI"/></a></td> 
                                 <td><a href="#"><img src="/img/icon/documents24.png" title="TSE-Managed RASCI"/></a></td>  
                                     <td><a href="#"><img src="/img/icon/documents24.png" title="Inactive RASCI"/></a></td>  
                 
                 
                 
                 </tr>
             
                  <tr>
                      <apex:repeat value="{!list_of_accountmanagement}" var="col_head">
                          <th id="rows">{!col_head}</th>
                      </apex:repeat></tr>
                  <tr>
                     
                              <apex:repeat value="{!list_of_accountmanagement}" var="col_head">
                          <td id="rowInfo" border="0"> 
                              
                              <apex:repeat value="{!map_values[col_head]}" var="col_val">
                                  <apex:outputLink value="/apex/anycustomeremployeetimedetail?id={!col_val.id}"
                                  onfocus="setDetailId('{!col_val.id}');" 
                                  onmouseover="setDetailId('{!col_val.id}');"
                                  onblur="setDetailId('');" 
                                  onmouseout="setDetailId('');">
                                      <apex:outputText value="{!col_val.overall_status__c}" escape="false"/>
                                  </apex:outputLink>             
                              
                              </apex:repeat>
                          </td>
                      </apex:repeat>
                      </tr>
                  </table>
            </apex:form>
        </apex:outputPanel>
</td>
<td width="20%">
    <apex:actionStatus id="detailStatus">
        <apex:facet name="start">
            <div style="text-align:center;">
                <img src="/img/loading.gif" alt="Loading graphic" />&nbsp;<strong>Loading...</strong>
            </div>
        </apex:facet>
        <apex:facet name="stop">
            <apex:outputPanel id="accountDetail">
                <br/>
                <br/>
       <apex:form >
   
           
<apex:pageblock rendered="{!hoverAccount!=null}" > 
    <apex:pageblocksection columns="1" id="name">
        <apex:outputfield value="{!hoverAccount.name}"/> 
        <apex:outputfield value="{!hoverAccount.type}"/> 
        </apex:pageblocksection>
    <apex:pageblocksection columns="1" id="ka"> 
    <apex:repeat value="{!$ObjectType.Account.FieldSets.Overview}" var="ov"> 
    <apex:outputfield value="{!hoverAccount[ov]}"/> 
    </apex:repeat> </apex:pageblocksection> </apex:pageblock> 
              </apex:form> 
            </apex:outputPanel>
        </apex:facet>
    </apex:actionStatus>
    
</td>
</tr>
</table>
</body>
</apex:page>

 

jayjaysjayjays
Hi,

Try standardstylesheets="true" as an attribute for the <apex:page> tag.

standardStylesheets A Boolean value that specifies whether the standard Salesforce stylesheets are added to the generated page header if the showHeader attribute is set to false. If set to true, the standard stylesheets are added to the generated page header. If not specified, this value defaults to true. By setting this to false, components that require Salesforce.com CSS may not display correctly, and their styling may change between releases.
Merry SMerry S

Thanks for the reply, James.

 

Nope, still showing offset from the top.

jayjaysjayjays

hmm, the page seems to work for me.  It did not show any style like you describe when I changed the showHeader to false but then when I refreshed it showed the images.  Seems like strange behaviour, have you tried clearing cache or setting cache="true" on the page tag?

Merry SMerry S

Neither worked. :( I will be trying again next week.

 

Thanks for the help!