Toggle Side Panel
Close search

Activity › Forums › Salesforce® Discussions › How can we give auto size the Salesforce visualforce page?

Tagged: , ,

  • PRANAV

    Member
    August 26, 2016 at 11:30 AM

    Hi Mohit,

    Use this code for auto sizing Visualforce Page:

    <apex:page sidebar=”false”>
    <apex:iframe src=”https://www.salesforce.com/” id=”theFrame” />
    <script>document.getElementById(‘theFrame’).height = window.innerHeight – 220;</script>
    </apex:page>

    Hope this helps you.

  • [adinserter block='9']

  • Avnish Yadav

    Member
    September 30, 2018 at 12:01 AM

    Hello,

    You can do something like this:

    HTML

    <div id=”boxContainerContainer”>
    <div id=”boxContainer”>
        <div id=”box1″></div>
        <div id=”box2″></div>
        <div id=”box3″></div>
    </div>
</div>

    CSS

    #boxContainerContainer {
    background: #fdd;
    text-align: center;
}

#boxContainer {
    display:inline-block;
    border:thick dotted #060;
    margin: 0px auto 10px auto;
    text-align: left;
}

#box1,
#box2,
#box3 {
    width: 50px;
    height: 50px;
    background: #999;
    display: inline-block;
}

    Thanks.

  • William

    Member
    December 19, 2018 at 3:51 AM

    Try this code:

    <apex:page sidebar=”false”>
    <apex:iframe src=”https://www.salesforce.com/” id=”theFrame” />
    <script>
        (function() { //this wrapper prevents pollution of the global scope
        var windowOnresize = window.onresize;
        window.onresize = function() {
            if (windowOnresize) windowOnresize(); //don’t trample the handler; intercept it
            document.getElementById(‘theFrame’).height = window.innerHeight — 220;
        };
        }());
    </script>
</apex:page>

Log In to reply.