Page_Id Backgound Color

You have disabled “right-click” so I cannot easily view your page source. I know why you are doing it but, read this article: Stop Using Copy Protection, from which I will quote:

If you have a problem with your website and ask the world at large for help, they will take one look and hate you. No one can easily help you with your CSS or your layouts or your design now, because you’re protecting content.

…and…

Anyone who uses a screenreader or an alternative mouse tool now, officially, hates you. You’ve made your site look like absolute crap. Some screen readers can no longer read your content at all.

But in using Firefox dev tools, this has a white background…

body.blog .page, body.page > .page, body.search > .page, body.error404, body.error404 > .page, body.woocommerce-cart.woocommerce-page {
    background: #FFF none repeat scroll 0% 0%;
}

@wallace

just call several css files according to custom page, menu, so on

it’s quite easy to fine tune, i use chrome dev tools and tidy in front end dev for example

I placed into custom css and my theme custom css

body.page-id-4245 {
background-color: #000000 !important; /* Changing to the color value you want */
background-image: url(https://whill.biz/wp-content/uploads/2015/12/home-15.png) !important;
}

Page flickers black background but goes back to white with a black footer?

Would really like to solve this issue I deactivated my content protector so that mouse right click can be used when viewing.
https://whill.biz/?page_id=4245

Also if you choose menu the backgound is BLACK, but not the page

This is missing some elements and can be combined.

body.page-id-4245 {
background-color: #000000 !important; /* Changing to the color value you want */
background-image: url(https://whill.biz/wp-content/uploads/2015/12/home-15.png) !important;
}

First, you don’t need the “https://whill.biz”

The background image needs to be told where to be (positioned) and to not repeat.

This is it with the “not repeat”:

body.page-id-4245 {
background: #000000 url(/wp-content/uploads/2015/12/home-15.png) no-repeat;
}

If you want the background image to cover the entire screen no matter what the size of the device one is viewing it on and stay in place, then this:

body.page-id-4245 {
background: #000000 url(/wp-content/uploads/2015/12/home-15.png) fixed center no-repeat;
background-size: cover;
}

If you want the background image to repeat all over the screen, this:

body.page-id-4245 {
background: #000000 url(/wp-content/uploads/2015/12/home-15.png) center repeat;
}

If it still does not do what you want or not show, then add the ” !important”:

body.page-id-4245 {
background: #000000 url(/wp-content/uploads/2015/12/home-15.png) center no-repeat !important;
background-size: cover !important;
}

All three examples work, however not the entire page itself. If you scroll down the bottom portion is black. If you select <<Menu, you can see the entire background is black (default is offset white)
*NEW Page id* (4245 deleted)
https://whill.biz/?page_id=4367

The template is set fullwidth

Page-fullwidth.php
<?php
/*
Template Name: Full width (without sidebar)
*/

get_header(); ?>

<div class=”l-main spaces-main pt-perspective page”>

<div class=”page-title”>
<div class=”row”>
<div class=”large-8 columns”><h2><?php the_title(); ?> </h2> </div>
</div>
</div>

<main class=”row l-main” role=”main”>
<div class=”large-12 main columns” id=”content”>
<?php
wp_reset_query();
while(have_posts()):the_post(); ?>
<article>
<?php the_post_thumbnail( ‘blog-thumb’ ); ?>
<div class=”body field”>
<?php the_content() ?>
</div>
<?php
if(get_the_tag_list()) {?>
<div class=””>
<h2 class=”field-label”>Tags: </h2>
<?php echo get_the_tag_list(‘<ul class=”links”><li class=”taxonomy-term-reference-0″>’, ‘<li class=”taxonomy-term-reference-0″>’, ”); ?>

</div>
<?php } ?>
<?php if (comments_open()){
comments_template();
} ?>
</article>
<?php endwhile;?>
</div>

</main>
</div>
</div>
<?php get_footer(); ?>

For large sections of code, please use PasteBin.

Let’s start with getting the background black.

Try this first…

body {
background: #000;
}

If not, then this…

.l-main {
background: #000;
}

No results
body {
background: #000;
}

Worked, but not fullwidth
.l-main {
background: #000;
}

https://whill.biz/?page_id=4367

body {
background: #000 !important;
}

.l-main {
width: 100%;
padding-right: 0;
paddin-left: 0;
margin-right: 0;
margin-left: 0;
background: #000;
}