• Closed
  • Marco Alvarado
    Spectator
    August 12, 2014 at 1:19 am #8574

    Hey guys,

    How do I get the background color to go the full width of the page. For example you have Orange all the way across, then white where the content of the forum is, then back to Orange all the way across with how many users decided to use your themes.

    In my instance, I’m trying to get the background color to go all the way across under the diver testimonial.

    QualityTimeDivers.com

    Thanks for all the help.

    -marco

    Alok Maheshwari
    Spectator
    Posts: 303
    August 13, 2014 at 12:03 am #10326

    There are some problems with your html. I would suggest you to fix them. Listing here some of them. You can check it at http://validator.w3.org

    1) Multiple <html> tag.
    2) <div class=”content” itemprop=”mainContentOfPage” home=”” singular=”” page=”” pageid-617″=””>
    pageid-617″=”” => pageid-617=””
    3) ID name with space inbetween ( <div id=”Diver Testimonial” …)
    There shouldn’t be space between id names. Make it ( <div id=”Diver-Testimonial”…) and then try the following css for making the background full-width

    #Diver-Testimonial {
    background: tomato;
    position: relative;
    }

    #Diver-Testimonial:after,
    #Diver-Testimonial:before {
    background: inherit;
    position: absolute;
    content: ”;
    top: 0;
    width: 100%;
    height: 100%;
    right: 100%;
    }

    #Diver-Testimonial:after {
    left: 100%;
    }

    Marco Alvarado
    Spectator
    Posts: 12
    August 13, 2014 at 5:06 pm #10328

    Hey Alok,

    Thanks for your input. I imagine this is done in the editor, but on what page?

    -marco

    Alok Maheshwari
    Spectator
    Posts: 303
    August 13, 2014 at 9:36 pm #10329

    Need to edit the theme files for fixing the issues. I assume you have got it edited somehow already since some of the issues like multiple html tags shouldn’t be there unless the file header.php was modified.

    Marco Alvarado
    Spectator
    Posts: 12
    August 24, 2014 at 1:28 am #10379

    Alok thanks for the input.

    Do I add that bit of code to the style.css file? If not, which file?

    -marco

    QualityTimeDivers.com

    Marco Alvarado
    Spectator
    Posts: 12
    September 11, 2014 at 5:54 pm #12854

    Per documentation on:

    http://theme4press.com/alora-documentation/shortcodes/full-width/

    Under evolve documentation it reads to use Alora as they are the same.

    <span style=”color: rgb(116, 116, 116); font-family: ‘PT Sans’, Arial, Helvetica, sans-serif; font-size: 17px; line-height: 25px;”>Here is the full width shortcode. It may be used in conjunction with any page template. However, should you wish your content or background to be 100% of the browser window, then you will need to use it along with the full width 100% page template.</span>

     

    I switched to the wide mode and trying to use the shortcode to make the background color go the full width of the page.  Is this not the 100% page template? If not, where does that get changed? I went to:

    Appearance > General Options > Select a Layout (chose the wide or far left option)

    (Layout Style – Wide)

    (Layout Width – 1200 Default)

    I don’t see a 100% option.

    This is what I used using the shortcode:

    <span style=”color: rgb(68, 68, 68); font-family: Georgia, ‘Bitstream Charter’, serif; font-size: 16px; line-height: 24px;”>[fullwidth menu_anchor=”” backgroundcolor=”#dd3333″ backgroundimage=”” backgroundrepeat=”no-repeat” backgroundposition=”left top” backgroundattachment=”scroll” bordersize=”1px” bordercolor=”” paddingTop=”20px” paddingBottom=”20px”]example[/fullwidth]</span>

     

    This is what I’m getting:

    http://qualitytimedivers.com/about-qtd/tripadvisor-reviews/

    How can I get this to go the full width of the screen?

    Thanks for your input.

    -marco

     

    Marco Alvarado
    Spectator
    Posts: 12
    October 7, 2014 at 12:40 am #13183

    Thanks for the help. Can’t wait to upgrade to next theme you sell. Best wishes to you and your exemplary support!

    Roman
    Spectator
    Posts: 3147
    October 7, 2014 at 8:00 am #13184

    100 % width page you can set when you edit a page,on the right side there is templates option where you can choose the 100% width template.