- This topic has 15 replies, 2 voices, and was last updated 2 years, 12 months ago by Skandha.
-
AuthorPosts
-
October 8, 2021 at 11:43 am #291956HansParticipant
Hello
I need to change the background color of one specific page. On that page there is now one image and under the image there is a white space.And I do not get rid of it. I tried to change the background image. I found numerous solutions, but all fail. One of the solutions of which I think it must work is on the catch forum:
.page-id-1859 #main { background-color: #f7f7f7; }
Also this css did not make the trick.Is there a solution for this problem?
Kind regards
Hans Hagmeijer
October 9, 2021 at 1:26 am #291990SkandhaParticipant@toerfiets: Hello Hans,
Can you please post the URL of the page where you want to change the background color?Kind Regards,
SkandhaOctober 9, 2021 at 3:16 am #292006HansParticipantHello Skandha,
I tried on hagmeijer.nl the css:
.site-header-main {
padding: 0;
}(I found that, not your suggestion)
This worked fine in Google Chrome.
But in safari on the Mac the sub-items dissapear.
That is amongst others why I should like the different background color, because the gap between image and menu disappears.Kind regards
Hans Hagmeijer
October 9, 2021 at 7:55 am #292005HansParticipantHello Skandha,
The URL is: https://www.sinfore.nl/?page_id=1085
What I should like is that this page is equal full width as https://www.hagmeijer.nl/test-2/.
The yellow part on hagmeijer.nl is an image with 1920 x 1200 px.
On https://www.sinfore.nl/?page_id=1085 the image is 1920 x 1000. Today I will make this image 1920 x 1200.Kind regards
Hans Hagmeijer
October 9, 2021 at 8:00 am #292027SkandhaParticipant@toerfiets: Hello Hans,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code..page-id-1085 #page,.page-id-1085 .header-media .wrapper { max-width: unset; width: 100%; }
Let me know if this works out!
Kind Regards,
SkandhaOctober 9, 2021 at 9:40 am #292029HansParticipantHello Skandha,
This worked fine as far as it concerns the width.
If it should be possible to give the page-id 1085 another background color, then it is totally fine, because then there is a connection between the menu and the image. Now there is still a gap between the image and the menu.
I tried:.site-header-main {
padding: 0;
}
This worked well in Google Chrome but didn’t work in Safari.Kind regards
Hans Hagmeijer.
October 10, 2021 at 9:51 am #292083HansParticipantHello Skandha.
I spent hours to find a aolsution and maybe I did not describe the problem.
What I should like is the functionality of changing background colors as is it standard in the possibilities of the customizer, but then for just one page. Then I should be very glad.
Is that possible.I tried many solutions from the supportforum, but every solution did not work.
Kind regards
Hans Hagmeijer
October 10, 2021 at 11:08 pm #292120SkandhaParticipant
@toerfiets: Hello Hans,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code./* To get rid of the gap between menu and the image */ .page-id-1085 #header-content { display: none; }
Can you let me know for which section you would like to change the background color on this page?
Let me know if this works out!
Kind Regards,
SkandhaOctober 11, 2021 at 2:44 am #292135HansParticipantHello Skandha,
This worked perfect. Thank you.
What I should like is the background color like in Customize -> colors -> page background color.
Then the whole page (content part also) gets the whisked color.
I should like -if it is possible- that the page section under the image gets the whisked background color.Kind regards
Hans Hagmeijer
October 11, 2021 at 11:22 pm #292180SkandhaParticipant@toerfiets: Hello Hans,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.#content, #site-generator { background: #ffc90d; }
Let me know if this works out!
Kind Regards,
SkandhaOctober 12, 2021 at 2:59 am #292196HansParticipantHello Skandha,
Thank you. This worked fine.
Kind regards
Hans Hagmeijer
October 12, 2021 at 5:55 am #292203HansParticipantHello Skandha,
There is still a problem. I noticed it when I looked the other pages. OM all the pages there occurs a little yellow band at the page bottom. see: https://1drv.ms/u/s!AlMivTDXp7Eso8t6Q0bmPuqcjjH5qQ?e=HG4230
I added: .page-id-1085 #content, #site-generator {
background: #ffc90d;
}
Because page 1085 is the only page with that color I added .page-id-1085 to the css you gave me.I should be glad when the little band at the bottom can dissapear.
Kind regards
Hans Hagmeijer
October 19, 2021 at 9:09 am #292607HansParticipantHello Skandha,
Did you already find a solution for this problem?
Kind regards
Hans Hagmeijer
October 20, 2021 at 6:27 am #292664SkandhaParticipant@toerfiets: Hello Hans,
Change the code I provided you above to.page-id-1085 #content, .page-id-1085 #site-generator { background: #ffc90d; }
Let me know if this works out!
Kind Regards,
SkandhaOctober 20, 2021 at 7:47 am #292671HansParticipantHello Skandha,
Thios is working fine. Thank you.
Kind regards
Hans Hagmeijer
October 20, 2021 at 7:50 am #292672SkandhaParticipant@toerfiets: Glad it worked out. Have a good day! 🙂
Kind Regards,
Skandha -
AuthorPosts
- The topic ‘different background color for one specific page’ is closed to new replies.