PS: How can I display a hero Background image in full width (100% screen width)?
Hi, thanks for reaching out.
You can stretch a row full-width by editing the row and then clicking on the Layout tab on the right. Set the Row Layout to Full Width Stretched.
For Hello Elementor you can add the below to Appearance > Custom CSS or Customize > Additional CSS:
.site-navigation ul.menu li ul {
z-index: 101;
}
Hi Andrew,
Thanks for your quick response. It is solved with the menu! Thanks!
>> You can stretch a row full-width by editing the row and then clicking on the Layout tab on the right. Set the Row Layout to Full Width Stretched
I did but it did not help.
I mean 100% screen Width https://www.dropbox.com/s/60lwrvcy96kp0f0/Full.png?dl=0
I am using Astra theme now but the hero image is 100% full screen.
Kindly reach out to the Astra authors. They’re disabling Page Builder Full Width Stretched using the following CSS:
.siteorigin-panels .siteorigin-panels-stretch {
max-width: 100%;
margin-left: auto !important;
margin-right: auto !important;
}
I’m not sure why that’s being done.
It works fine on Hello Elementor!! I will use this one. Thanks!
The image is blurry (not sharp) and a bit red. The same image looks fine on another website with Avada Fusion slider/builder.
Glad to hear you’re making progress.
We’d need to inspect the image on the live site.
Thanks. The image is 1024px wide. If your resolution is more than 1024px wide the image will lose quality. The larger your display the more so. Uploading a larger version of this image will help the problem.
I know. Here is the exactly the same image with Fusion slider, 100% full width. It is sharper.
https://rebrand.ly/fuztf
Do you see also the difference in colors?
I’m not sure. The Hero has a background image opacity setting which creates an overlay effect. Perhaps you had decreased the opacity slightly.
Tied all option with the the opacity but it did not help. This overlay effect makes the image look not sharp and unnatural. Could it be done like here ( with the Fusion slider)? https://rebrand.ly/fuztf
This overlay effect is only for the text, not for whole image. If it not possible, than is no point to use the SiteOrigin builder for us (but I like its speed very much!)
Please, create a test page with the Hero and Fusion slider inserted.
Different images are being used.
You are right! Sorry my bad. It looks good now.
