Home Forums Weaver Xtreme Theme padding?

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #64608
    LorSmi
    Participant

    I’m not sure where to go to get where I want here. On the “test page for image viewing” is a screenshot of what this site looked like in Weaver II. You can see on the home page that I’m not there yet. I don’t know where to go to achieve the look I want in the content area. (the Weaver II version home page was also centered, you just can’t see that in the image)

    Any help would be MUCH appreciated!

    Thanks

     

    HOME

    #64610
    scrambler
    Moderator

    The difference I notice are:

    • You are missing padding on the wrapper
    • Your Container area has rounded corner but not in your original
    • Your beige color is on your container instead of on your overall background.

    If there are other issues, be specific

    #64617
    LorSmi
    Participant

    What I’m trying to achieve is that wrapping of the light tan color all the way up and around the header image. I did add padding to a bunch of places in the wrapping tab however I don’t really know what I’m doing here!

     

    You can see some small changes that I did with padding in the wrapping area on the home page now.

     

    #64618
    scrambler
    Moderator

    You have added a mix of padding to the side and margin for top bottom on the wrapper.

    You need to use all padding

    In main options > Wrapping areas > Wrapper area, put the same padding values in the for boxes (R,L,T,B) and put a zero in the Margin top/bottom boxes.

    Then put your light beige color #FEF3DD inside wrapper area BG box

    Then if you want the wrapper top corners rounded as on your original, select Top corners in the rounded corner box

    That will give you the light beige color on the whole wrapper with a padding all around so it goes around the header.

    You could subsequently put transparent in the Content Area BG box, and remove the corner option on the content area.

    #64621
    LorSmi
    Participant

    Thanks – it looks MUCH BETTER!

    Now, last thing – how do I move it all down so that a strip of the background shows up top? (see the Weaver II image in the test page tab)

     

    #64622
    scrambler
    Moderator

    It looks the same to me, there is the same space at the top than on the side.

    Make sure you are looking at the site when not logged into WP as the WP status bar at the top can interfere.

    I also notice that in the old site you only had rounded corner at the bottom of the menu bar which created a more cohesive look between the header and the menu bar.

    On the new one you have rounded the top of the menu bat which looks a little weird 🙂

    #64623
    LorSmi
    Participant

    Yes – you’re right! I did fix the menu.

    But the content area still hugs the top of the page. See in the Weaver II image how a bit of the dark background show? I am checking the live site from a different browser, where I don’t log in from, so its not the status bar…

    #64626
    scrambler
    Moderator

    OK, I see it now, sorry

    For this, you need to add a top margin to the Wrapper in main options > Wrapping areas > Wrapper area, Margin top box

    #64627
    LorSmi
    Participant

    Thank you – its all the way I want it now! One more question, what is the difference between Wrapper area and Container area, both in the Wrapper tab? I added top margin to both.

    #64628
    scrambler
    Moderator

    The wrapper is the whole website

    Inside the wrapper are the Header, below the container, and below the footer.

    Inside the container are the content area and the sidebars.

    I think the help has details on that

    So if you add margin at the top of container, you create extra space below the header

    #64629
    scrambler
    Moderator

    Something else, you have the wrapper set to a max width of 940px, which by the way is a bit narrow these days. With todays devices, usually a 1200px is more appropriate.

    but regardless of the chosen width, when the browser gets below that width, you would want to eliminate the top margin, to match the side. Below 940px right now, the wrapper extends to the right and left edge, and you end up with a weird dark bar at the top.

    To eliminate the wrapper top margin below the chosen width of the wrapper, add the rule below to the theme Global Custom CSS Rule box

    @media all and (max-width:940px;) {#wrapper {margin-top:0px;}}

    If you enlarge the wrapper replace 940px by the new wrapper width

    #64630
    LorSmi
    Participant

    I changed it to 1200 and I didn’t like the way it looked. The top dark spacing (like seen on my iPhone) doesn’t bother me.

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.