Archived topic
Sections add-on
6 replies · Started by Michal Janata on August 28, 2016
Hello,
I have a problem with the section add-one.
Background image is not centered. On different monitors it looks different.
How it should look like
https://drive.google.com/open?id=0BxqENvliGlagTkN0Skh5YkRhamM
It does not look like this
https://drive.google.com/open?id=0BxqENvliGlagLVgzd2NXZEpCd1U
The site's address is http://tancovani-test.skauting.cz/
I need to give set centering background. It's something to do?
thank you for answer
You would have to create another narrower version of your background image and then swap out the original for the new one using CSS, the code below would change the image for Tablet (portrait) and smaller:
@media screen and (max-width: 768px) {
#generate-section-1 { background-image: url(http://tancovani-test.skauting.cz/wp-content/uploads/2016/08/new-bg.jpg); }
}In most cases you need to set an image specific to mobile as Andy has pointed out.
Alternatively, you can force it to be centered with this:
.generate-sections-container {
background-position: center center;
}Great, thank you very much. Solved :-)
You're welcome :)
Helped me, too. Thank you.
Awesome :)
