• Resolved Soraya

    (@sofiori)


    Hi Ben, i’ve just bought a background image license, but when i try to use a random background it’s not visible. Only the social media bar gets darker and the title/tagline at the end of the page turned out black. What do i have to do? I hope you can help me again. Sorry for all those questions.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter Soraya

    (@sofiori)

    This is my Custom CSS:

    .top-navigation,
    .menu-secondary-items {
    background: #6d6d6d;
    }

    .main,
    .overflow-container,
    .site-header {
    background: #6d6d6d ;
    }
    .excerpt-title,
    .entry-title {
    font-weight: 600;
    }
    .design-credit {
    font-size: 13px;
    color: ;
    }
    .toggle-navigation {
    color: #ffff;
    }
    .site-title img {
    max-height: 999px;
    max-width: 999px;
    }
    .site-footer {
    background:#6d6d6d;
    color: #ffffff;

    }
    .sidebar-footer {
    background:#6d6d6d;
    margin-bottom: 0px; /* if you need more room */
    }
    .design-credit {
    background:#6d6d6d;
    }
    .entry .featured-image {
    padding-bottom: 30%;
    }
    .site-title a {
    font-family: \”Times New Roman\”, Georgia, Serif;
    }

    h1.excerpt-title {
    font-family: \”Times New Roman\”, Georgia, Serif;
    }
    .entry,
    .comments {
    background: none;

    }

    .page-template-front-page .entry-header,
    .page-template-front-page .entry-container {
    display: none;
    }
    .page-template-front-page .entry {
    background: none;
    }

    #menu-primary-items a,
    #title-info a {
    color: #fff;
    }
    .blog .site-footer {
    margin-top: 0px;
    }
    .site-footer {
    margin-top: 0px;
    }

    .title-info {
    width: 100%;
    text-align: center;
    }

    .site-title img {
    max-height: 999px;
    max-width: 999px;
    }

    .toggled .site-title img {
    opacity: 0;
    }

    .author-meta {
    display: none;
    background: #6d6d6d;
    }

    .further-reading {
    display: none;
    }

    @media all and (max-width: 400px) {

    .site-title img {
    display: none;
    }}

    .entry-tags,
    .entry-categories {
    display: none;
    }

    Thread Starter Soraya

    (@sofiori)

    Update: the background is visible when i delete my complete Custom CSS. Something is wrong with some of the codes/or a code is missing…but what code? 🙁 Is it also possible to change the size of the background image because the image is very very big with every image i try. You see big pixels

    Theme Author Ben Sibley

    (@bensibley)

    Thanks so much for upgrading!

    Here is the part that is covering up the background image:

    .main,
    .overflow-container,
    .site-header {
    background: #6d6d6d ;
    }

    If you remove .overflow-container from that CSS, the background image will show.

    If the image is showing up pixelated, this means the image is too small for the space it is filling. Do you have a larger version of the image you could use?

    Thread Starter Soraya

    (@sofiori)

    Thank you very much Ben! It’s solved. I love my website now and how to figured things out about css. Your help is just the finishing touch! Thanks!!

    Theme Author Ben Sibley

    (@bensibley)

    That’s awesome! So glad you’re happy with it 🙂

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Visibility background image’ is closed to new replies.