function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Kelsey DuncanKelsey Duncan 

align logo to right of page - issues

Hello,

I am trying to move my logo to the right of the page - I have tried every variation of align right/float right/position right I can think of.
I have changed this section of the Visualforce page at least 30 times and the only time I have been able to move the logo to the right is by using 
position: absolute; right: 0; - the issue I have when I use this is the logo appears over all my text and i'm not sure how to prevent this?

Nothing else I have tried has managed to get the logo to move anywhere from the top left - I have spent about 5 hours now just trying to move this logo so I am willing to try anything. If anybody has any suggestions I would be extremely grateful!

<head>
<style type="text/css">
@page{
      size: landscape;
      margin: 10%
      @top-right {
        content: "element(header)";
        }
      @bottom-left {
        content: element(footer)";
        font-family: Helvetica, Arial, sans-serif;
        font-size: 8px;
        }
}
div.header {
    position: running(header);
    right: 0;
           }
div.footer {
    position: running(footer);
    bottom: 0;
    }           
body {
      font-family:Helvetica, Arial, sans-serif;
        font-size: 11px;
        }
table {
       font-family: Helvetica, Arial, sans-serif;
}
</style>
</head>
<body>
           <div class="header" style="right: 0">
              <div><apex:outputField value="{!accountDetails.Invoice_Logo__c}"/></div>
                  <br />  
           </div>

Thanks,

Kelsey
mritzimritzi
please post the image, you are using here and provide a mock up of the page (to show where exactly do you want the image, with respect to other text/content on the page)
Sampath SuranjiSampath Suranji
Hi Kelsey,

Try to add below 'text-align: right;' tag to the parent div of Apex:output field 
<div style="text-align: right;"><apex:outputField value="{!accountDetails.Invoice_Logo__c}"/></div>
Best Regards
 
Kelsey DuncanKelsey Duncan
Hello,

Sorry for the delay in replying!!

@mritzi - the image is a company logo and I need it at the top right of the page. In the header above the company address.

@Sampath - I have tried that and the logo remains on the left of the page... the only time I have ever been able to get the logo to move from the left is to use position: absolute; right: 0; which then places the logo over the company address.

Thanks!