- This topic has 5 replies, 2 voices, and was last updated 4 years ago by David.
-
AuthorPosts
-
March 24, 2020 at 11:37 pm #1209160Davood
I’m having two problems with the hero slider and images.
1) When setting the full width option the slider (on homepage) and images (on inside pages) do not appear full width on all computer screens. On my coworkers MacBook Pro they are full width, while on my iMac they are not. How can I fix this?
2) I need the homepage hero slider and inside pages hero images to be the same height. How can I accomplish this?
We are using the Luxedo site layout by FlixFrame from the elementor section of site library page.
Thank you in advance.
March 25, 2020 at 6:39 am #1209455DavidStaffCustomer SupportHi there,
1. The Site is a contained site which has a Customizer > Layout > Container width of 2000px. You’re slider image is around 1920px hence on the larger screens it doesn’t extend to the edge of the container. You could use a wider image or simply reduce the container width to suit the image.
2. They look pretty close – and you’re using % padding which is the way to size them responsively. I think we could be dealing with a decimal point on the % difference. Which would require some CSS.
eg.
.page-hero { padding-top: 14.5%; padding-bottom: 14.5%; }
March 25, 2020 at 6:46 am #1209468DavoodThanks David,
For the first question, is that the problem with all the images, are they smaller than the width of my iMac?For the second question, I do not think you understood the question… we want all pictures to be the exact same height at all times. Right now I have the settings set to the default settings. I am asking what I need to change to make sure the images are the same height at all times.
March 25, 2020 at 7:20 am #1209517DavidStaffCustomer Support1. If you’re on a 27″ imac then the native default resolution is 2560px. So the there are two things:
a. The Customizer > Layout > Container –> Width is set to 2000px.
so the entire sites content will never span to the edges of the screen.b. The images in the Slider are only 1920px.
So the actual slider images will never actually fill the Content area.As the site was designed around a maximum width of 2000px i would not suggesting increasing
a.
but actually reduce it to 1920px so at least your widest images reach the container edges.2. The internal pages uses the Header Element:
https://docs.generatepress.com/article/header-element-overview/The height of which is defined by the top and bottom padding plus any HTML in the header elements content. So are you wanting the header element to be a fixed height ? No matter what the screen size?
March 25, 2020 at 7:39 am #1209541DavoodForget about the images that are there… they are all temp.
In #1 I am asking when we use an image that has a width of 2600 or greater how can we guarantee that it will be full width on ALL screens.In #2 I am asking how we make the homepage hero slider AND the internal pages hero images all the same height. Yes, we want the pictures to all be a fixed height and we want the height to match the slider height. That is my understanding from the client.
March 25, 2020 at 8:36 am #1209746DavidStaffCustomer Support1. If you want the content to always extend to the edges of the screen then you need to set the Content to Full Width for those pages. You can do this using the Layout Element:
https://docs.generatepress.com/article/layout-element-overview/
And selecting the Content tab to choose full width:
https://docs.generatepress.com/article/layout-element-overview/#content-1
Then you need to set the Display Rules to the
Front Page
andPages > All Pages
this will make sure the Blog and single posts are not affected.2. I think for your needs it may be easier if you remove the Header Element that is assigned to the Pages and add your images to those pages in the Elementor editor – then you can set the sizes etc you need.
-
AuthorPosts
- You must be logged in to reply to this topic.