Widgets/Sections Not Aligning With Header
-
Hello WordPress world!
I am a WordPress n00b currently creating my website via Elementor, and I am finding that my background and sections are no longer aligning with my header.
Everything worked perfectly on the first two pages I designed (“Home” and “Contact”), however on the pages I have started working on afterward, everything is shifted to the right. I have checked my settings on the dashboard/WordPress side of things, and they seem to match the other pages that are working correctly.
Any help would be appreciated!
The page I need help with: [log in to see the link]
-
Hi Logo, My FireFox is where this first happened. I just tried this on a second computer and it also truncates the lower part of the screen. The Jackiedew.com page is the only one that does this. Size is locked down.
Strange, I do not see that, not even in Firefox.
Do you have the most recent version of Firefox?
Mine is the most recent version 61.0.1.Logo, did you see my posts about the image is actually larger than what shows on the screen. It’s like there is a black border on the Left and Right. I used Inspector and was able to change the margins and the picture opened up and showed more of the image to the left. The image didn’t move, you could just see more of the brick wall with the second concrete window.
Home Page issue FireFox 61.0.1 using Win 10 – Forget this issue, I checked a third computer and it didn’t have the same issue. It may be related to a resolution settings. I have large TV’s as monitors on 2 of my computers.
Logo, The picture that seems to be moved right appears to be the first layer on the page, the right and left black areas are on top of the picture. It’s not moving the picture, it’s reducing the size of the border that covers it up. I don’t know how you change this margin setting on Jackie’s theme.
I wish I could duplicate this so I could work on the actual issue.-
This reply was modified 7 years, 9 months ago by
LesTexas60.
-
This reply was modified 7 years, 9 months ago by
LesTexas60.
@ Les,
Sharing images is easy with the free online tool “Snaggy”
https://snag.gy/
Just paste the url it produces here like this test: https://snag.gy/FoeMJI.jpgPS. no seems like I missed all these comments, now I saw them, you might be on to something there inspector Les 🙂
-
This reply was modified 7 years, 9 months ago by
LogoLogics.
-
This reply was modified 7 years, 9 months ago by
LogoLogics.
Jacky,
Looks like you have inserted the background image in Style > overlay background and not in Style> background?
As Lex is saying, maybe you have set large border or effects in there?
You should insert the background image in Style, background and remove the images and if so any effects, margins, borders that you might have set in there…Thanks for the Snagy hint. I have used the snipping tool for years and forgot about Print Screen. I am surprised it captures both of my monitors screens.
-
This reply was modified 7 years, 9 months ago by
LesTexas60.
Jackie & Logo, Take a look at this image. I don’t know if you changed something but I was able to make the image line up with the “boxed-layout Wrap container” Set padding left to 0 .
I clicked the menu box to get to the padding area that worked.
https://snag.gy/LIFe9x.jpg – This shows 2 pages-
This reply was modified 7 years, 9 months ago by
LesTexas60.
LesTexas60,
I hate being that person, but I’m a n00b, so I can open it up in Inspector, I found the line you have highlighted in your image (or did… Then I clicked something and lost it… :p), but I’m a total loss as to what I’m supposed to do after that.
I’m so sorry -_-And Logo, I have the image in Background, and then I have a colour overlay in Background Overlay. 😛
Thanks again for both of your help!
Jackie, the image was more for Logo because that is the only way we can see the code. You would change your padding through Elementor. The Inspector tool only lets you make temporary changes to see what they look like. See if you can find your menu container and if you can access the margins and padding for that section.
As I said, I wish I could duplicate the issue so I could get into the actual screens to see what is going on. I am also learning a lot going through this process.
Yep, almost impossible to know what was done, where…..
So strange it’s ok on home and contact…Actually seems to tell us, that this can not be some wrong margins in global settings, because in that case it should go wrong globally, unless Jacky has some per page settings that are different from that home and contact page?
-
This reply was modified 7 years, 9 months ago by
LogoLogics.
Logo, Is there a way to clone a page to a different name? I was thinking if the Contact page could be cloned to another page name to see if that works, then it could be modified one step at a time to see if the problem came back.
I love puzzles..
Sure, I think you suggested that earlier?
She can install for example this: https://nl.wordpress.org/plugins/duplicate-page/Duplicate the homepage, give it another name and insert the same content as dancer,
NOT copy the actual sections, because she might have set things not correctly there.-
This reply was modified 7 years, 9 months ago by
LogoLogics.
Hi Guys,
Sorry- I fell off the grid for a few days.
I just tried duplicating the page, and recreating the About pages, and it *seems* to work (hard to tell on Safari on my laptop… Am going to head home and check on my PC).
Seems like for whatever reason, this might be the answer.Thanks for all of your help this week! I really appreciate it! 😀
Yea. looks perfect.. One day you might find that one little setting that caused the issue.
The one thing I did notice is the image doesn’t seem to have an overlay on this to darken the image like the first one had.Les
I realized the overlay had been set to “screen” when I duplicated the page, rather than normal. Should be fixed now.
Thanks for all of your help! 🙂
-
This reply was modified 7 years, 9 months ago by
The topic ‘Widgets/Sections Not Aligning With Header’ is closed to new replies.