Home Forums Porto Template Logo/Image with div class="tp-caption" resizing super small on mobile versions

This topic contains 1 reply, has 2 voices, and was last updated by  Support2 3 weeks, 4 days ago. This post has been viewed 86 times

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #10030526

    kylander
    Participant

    Love the template so far. I’m trying to include a logo in the center of the screen above some text and a button. At 1920×1080 the logo looks fine, but at smaller resolutions (like for the iPhone) the logo seems to scale down super small.

    I used index-classic-video-light.html as a starting point. The div class is “tp-caption”. The actual code is below:

    <div class="tp-caption"
    									data-x="center"
    									data-y="center"
    									data-start="1000"
    									data-transform_in="x:[100%];opacity:0;s:500;"
    									data-transform_idle="opacity:1;s:500;" style="z-index: 5;">""</div>

    Here’s the full relevant section:
    https://pastebin.com/raw/zFTwPZrX

    – Kylan –


    • This topic was modified 3 weeks, 4 days ago by  Support2.
    #10030533

    Support2
    Keymaster

    Hello, thanks for your purchase.

    This is the default/expected behavior of revolution slider image layers.
    An workaround is force a CSS style:

    HTML:

    <div class="tp-caption tp-resizeme"
    	data-x="center"
    	data-y="center"
    	data-type="image"
    	data-width="['auto']"
    	data-height="['auto']"
    	data-start="1000"
    	data-transform_in="x:[100%];opacity:0;s:500;"
    	data-transform_idle="opacity:1;s:500;" style="z-index: 5;"><img class="custom-image-style" src="img/logo.png" alt="A Long Journey to an Uncertain End" /></div>

    Add in (css/custom.css):

    .custom-image-style {
    	width: 200px !important;
    	height: auto !important;
    }

    * Change the width value to your image size.

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


Viewing 2 posts - 1 through 2 (of 2 total)