Home Forums Weaver Xtreme Theme Full Width site and CSS problem with V5

Viewing 16 posts - 1 through 16 (of 26 total)
  • Author
    Posts
  • #69869
    jsternfe
    Participant

    I have 3 websites using Weaver Xtreme in Full Width mode, and in the past, under Custom CSS Rules, I have used:

    @media screen and (min-width: 768px) {
    #wrapper {
    width: 80%;
    }
    }

    to show some background on desktop screens.  Upgrading to V5 makes this not work, the main content area is full width.  Can you suggest the correct CSS for the new version please?  Thanks in advance!

    -Jon

     

    #69870
    GR8FL
    Participant

    I have same issue. Below is my CSS. Reverting back until I can get a fix.

    Thanks you.

     

    @media screen and (min-width:768px){ul.wvrx-menu {margin-left:0;}
    .wvrx-menu-right {margin-right:0;}
    img.wvr-btn-6 {padding-right:15px !important;}
    #footer-widget-area {padding:8px 0 0 0px;}
    #footer-widget-area .widget-4 {padding-right:0px;}}

    #69872
    scrambler
    Moderator

    We need a link to the site with your rule in place so we can see what is going on

    #69874
    jsternfe
    Participant

    Take a look at http://unyhs.org I restored from a backup so this is how it was, and how I want it to look.  After loading v5 the content area went edge to edge.

    #69875
    scrambler
    Moderator

    Unless I can see the site on v5, there is no way to see the issue.

    I will try your rule on a test site

     

    #69876
    scrambler
    Moderator

    You rule still works on my test site with v5.

    How is your site set to full width exactly?

    Can you install V5 and post back?

    #69877
    scrambler
    Moderator

    @jsternfe

    I found that is you use align full your rule indeed does not work.

    In your case, I would say instead of using your rule use the Left/Right Padding % option, and set that to 10%


    @GR8FL
    we will need to see the site under v5

    #69878
    GR8FL
    Participant

    @Scrambler,

    I will update our staging site with the theme and take it off of maintenance for you to see.

    I saw this message when I opened the WP Admin: INFORMATION: The settings you are using are from Weaver Xtreme V4. They have been automatically converted to V5 equivalents. It is possible that you will find some small differences in how your site looks. You should also save these converted settings from the settings interface.

    Here is the URL: https://sdi-staging.sussexaa.org/

    You can compare it to our live site to see the difference which doesn’t have version 5 installed.

    https://sussexaa.org/

     

     

    #69881
    scrambler
    Moderator

    You just need to go to the header image setting, and set the header image to align: alignfull

    Then go to the menu setting, and in the class box, type wvrx-fullwidth

    @weaver, I noticed that you forgot to add the align option “Extend BG to full width” in the menu align option

    #69884
    GR8FL
    Participant

    You just need to go to the header image setting, and set the header image to align: alignfull

    Then go to the menu setting, and in the class box, type wvrx-fullwidth


    @Scrambler
    , I did the above and now the menu bar is not full width.

    #69886
    scrambler
    Moderator

    Are you sure that Appearance > Xtreme Admin > Main options > Menus > primary Menu Bar > Add Classes Box has

    wvrx-fullwidth 

    in it?

     

    #69889
    GR8FL
    Participant

    That took care of it @Scrambler. Thank you.

    What was done in this update that caused these issues? I have 3 other sites and am wondering if the same needs to be done.

     

    #69890
    jsternfe
    Participant

    Hi @Scrambler,

    The padding % got us closer but still not perfect.  The header, menu and text shrunk, the background container (not sure what to call it) did not.  I have left v5 on for now for you to take a look.  I took screen shots too but can’t figure out how to post them here.

    -Thanks,

    Jon

     

    #69895
    scrambler
    Moderator

    @jsternfe my bad I did not realize the background was on the wrapper.

    Do the following instead.

    • Remove the 10% L/R padding on the wrapper
    • In the wrapper align option select center instead of alignfull
    • in the Wrapper “Theme Width” box type 10000 (Site wide spacing in the customizer)
    • Add your old 80% rule back.


    @GR8FL

    You can check the Release notes for all the detail, but the old legacy full width options were removed and incorporated in the align area option, and some changes were made to the wrapper width and centering.

    #69897
    jsternfe
    Participant

    @scrambler, that looks much better but still not quite right.  On my 1920×1080 monitor, the content area is now much narrower than it was.  I think it’s forcing 1000px wide instead of 80% of the screen width?

     

    #69898
    scrambler
    Moderator

    You used 1,000, I told you to use 10,000 🙂

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