WordPress.org

Ready to get started?Download WordPress

Forums

Quark
[resolved] Full width background Images (4 posts)

  1. slamjam
    Member
    Posted 8 months ago #

    Hi i try to style your great theme the way i want it.

    I am a css beginner with some basic know-how. And i am sure there is a easy solution for what i want.

    I am using a static front page with the build in frontpage template. Know i would like to have a full-width <div></div> width a full width background image, similar to the front-page banner.

    Example:
    After the front-page banner i have <div>some h2 and some text</div>
    After this sector i would like to have a full-width div with background image or color.

    How could i style this div?

    Until now i know only one way to style it:
    Make the whole theme full-width and resize the divs i don't want to have full-width. But i am sure there is a better way to make it.

    I know this text is hard to understand as my english is not that good :-)

    So if you have questions feel free to ask!

    regards
    rude

  2. slamjam
    Member
    Posted 8 months ago #

    I think i have found a solution. Not sure if it is perfect. Here are the css rules for the div:

    <div style="background: red; width: 158.75%; max-width: 158.75%; margin-left: -29.5%; margin-right: -29.25%;"><div style="margin: 0 auto; width: 90%; max-width: 1200px;">

  3. ahortin
    Member
    Theme Author

    Posted 8 months ago #

    If you want a full width background image on the main content area, then all you need to do is add a background image to the #maincontentcontainer style, like so...

    #maincontentcontainer {
      background: url(images/bg.jpg) no-repeat center center fixed;
    }

    *Obviously replace images/bg.jpg with your own image url.

  4. slamjam
    Member
    Posted 7 months ago #

    Hi, thx for your answer. I think my question was a bit wrong.

    What i want is not a simple background image.

    I will try to explain (my english is not that good :-) )

    I want (only on the static front-page with your front-page template):

    Header, Nav, Banner - no changes
    Maincontent - no changes:
    some <h2>This is my new site</h2>
    some text to explain the goal of my site

    And now it comes:
    To make a break and give some space i would like to have a full-width <div> with other color or with a background- image

    And after that i will go on with some other text and pictures.

    It's working with the css in my second post, but i am sure there is a better way.

    If you don't understand mark this post as resolved :-)

    I will try to find a example page.

Reply

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.