Okay
  Public Ticket #2346751
Page Header Image not responsive
Closed

Comments

  • ilyazobanov started the conversation
    April 2, 2020 at 3:06am

    I have uploaded an image 1600 x 649 into my home page header and it is not responsive on my mobile.  Can you please tell me what i need to do to make it so?

  •  3,022
    Andrew replied
    April 2, 2020 at 6:50am

    Hi there,

    Use the following custom css in Salient > General settings > CSS/Script related:

    @media only screen and (max-width: 1000px) {
   .page-header-bg-image {       
    background-size: 100% 100% !important;
}
}

    Hope this helps.

  • ilyazobanov replied
    April 2, 2020 at 2:17pm

    Hi Andrew,

    I copy and pasted your code, cleared my cookies and it still looks the same.

  •  8,992
    Tahir replied
    April 2, 2020 at 7:26pm

    Hey Again,

    I am afraid its not possible to set the same Image for both Wide and Tall Images so you will need to remove the Text From the Image and add it as a Page Title. 

    Best 

    ThemeNectar Support Team 

  • ilyazobanov replied
    April 3, 2020 at 4:59am

    Is there no way to have a different image for mobile and one for desktop?  It looks horrible on mobile even with the 1600 px x 475 px dimensions.

  •  8,992
    Tahir replied
    April 3, 2020 at 9:00am

    Hey Again,

    Try using a "Single Image" Page Element on the page rather than adding a box roll header. 

    Best 

    ThemeNectar Support Team