Above is the demo on your site. If view it in mobile device, the top featurn image aligns to left and does not extend to the full width of the content container.
Is there any way to change the behaviour of this image when viewed on mobile?
Hey asiabchk,
Please try the following in Quick CSS under Enfold->General Styling:
@media only screen and (max-width: 767px) {
.big-preview.single-big {
padding: 0;
}
}
Best regards,
Rikard
Try this in quick css :
@media only screen and (max-width:767px) {
.big-preview.single-big {
padding: 0 0 30px;
}
.big-preview a {
overflow: visible !important;
}
.big-preview.single-big img {
width: 101vw !important;
min-width: 101vw !important;
position: relative;
left: -9% !important;
margin-top: -50px;
}
}
please do not ask where the -9% left positioning comes from ( on theory 7.5% should be enough – because .container width on default is set to 85% ) – so I cowardly opted for a little more width. ;)
Hi Rikard, you CSS can enlarge the image to fit the container of post in mobile view, it simply works. Thanks.
Hi Guenni007, thank for help. Your CSS is step further to enhance the look of the image in mobile view. Thanks.
— Case Closed —
Sorry – I must have misunderstood your demand.
That was not quite clear to me – maybe you should have just said that you wanted to stretch the picture on the right to have it in a block set. It sounded to me like you didn’t want to have the alignment. ( aligns to left and does not extend ): my fault
Hi asiabchk,
Great, I’m glad that you got things working. I’ll go ahead and close this thread for now then, please open a new thread if you should have any further questions or problems.
Thanks @guenni007 for helping out as well :-)
Best regards,
Rikard