Topic Resolution: Resolved
  • Closed
  • Larkoll teamet
    Spectator
    July 26, 2015 at 12:59 pm #19184

    My page:

    The problem is with this code:
    [fullwidth backgroundcolor="#f2f4f6" backgroundimage="" backgroundrepeat="no-repeat" backgroundposition="left top" backgroundattachment="scroll" bordersize="0px" bordercolor="" paddingTop="40px" paddingBottom="0px"]
    <h2 style="text-align: center; font-size: 40px!important; margin-bottom: 0;">Gullsponsorer 2015</h2>
    [recent_works layout="carousel" filters="no" columns="2" cat_slug="gull-2015" number_posts="10" excerpt_words="15" animation_type="fade" animation_direction="down" animation_speed="1"][/recent_works][/fullwidth]

    Like you can see, I dont get full width when i have background color, but get full width when its with native background color.

    Can you help me with this?

    Denzel Chia
    Moderator
    Posts: 2672
    July 27, 2015 at 7:32 am #19197

    Hi,

    Please post your website url with the mentioned shortcode.
    Please try using a 100% width page template.

    Thanks!

    Larkoll teamet
    Spectator
    Posts: 25
    July 27, 2015 at 8:41 am #19201

    Sorry, forgot the link:
    http://larkolluka.no/wp/test123/

    The page already using 100% width template

    Imran
    Spectator
    Posts: 403
    July 27, 2015 at 3:32 pm #19211

    Hi Larkoll,

    Thanks for writing in, if you wish to achieve full width on your recent works, so you can add the following code under Appearance > Theme Options > custom CSS:

    #main .alora-row {
    margin: 0 auto;
    max-width: 940px;
    max-width: 100% !important;
    }

    .caroufredsel_wrapper {
    margin: 0 auto !important;
    width: 100% !important;
    }

    Thanks.

    Larkoll teamet
    Spectator
    Posts: 25
    July 28, 2015 at 8:14 am #19247

    When I add this changes, I “destroy” other pages that use recent works.

    If you can take a look here:
    http://larkolluka.no/wp/test123/

    The recent works that is inside the gray field has not 100% width, but the recent work that is in button has 100% width. It need to be another solution then change the CSS for the whole website.

    Imran
    Spectator
    Posts: 403
    July 28, 2015 at 4:50 pm #19269

    Hi Larkoll,

    Would you mind providing more clarification about your exact issue and be more clear in what you want us to assist, so we can provide you with a tailored response.

    Thanks.

    Larkoll teamet
    Spectator
    Posts: 25
    July 29, 2015 at 8:17 am #19311

    Hi, check this picture: http://s2.postimg.org/43kx4kjwp/2015_07_29_08_09_36.png

    Want RecentWorks inside the red frame to get full width like the one i blue frame.

    The code:
    RED:

    [fullwidth backgroundcolor="#f2f4f6" backgroundimage="" backgroundrepeat="no-repeat" backgroundposition="left top" backgroundattachment="scroll" bordersize="0px" bordercolor="" paddingTop="40px" paddingBottom="0px"]
    <h2 style="text-align: center; font-size: 40px!important; margin-bottom: 0;">Gullsponsorer 2015</h2>
    [recent_works layout="carousel" filters="no" columns="2" cat_slug="gull-2015" number_posts="10" excerpt_words="15" animation_type="fade" animation_direction="down" animation_speed="1"][/recent_works][/fullwidth]

    BLUE:

    [recent_works layout="carousel" filters="no" columns="2" cat_slug="gull-2015" number_posts="10" excerpt_words="15" animation_type="fade" animation_direction="down" animation_speed="1"][/recent_works]

    If I use recent works alone, its fine, but it looks for me that recent works and fullwidth do not work together.

    Hope you understand better now.

    Denzel Chia
    Moderator
    Posts: 2672
    July 29, 2015 at 9:26 am #19317

    Hi,

    Your screenshot http://s2.postimg.org/43kx4kjwp/2015_07_29_08_09_36.png is too small cannot see anything.

    After reading your explanation, I assume that the following screenshot is what you want to achieve. http://prntscr.com/7yakpe

    Please use the following codes in Theme Options -> Custom CSS
    It will only affect fullwidth shortcode. You can change the 90% to a larger number.

    .t4p-fullwidth .alora-row {
    max-width: 90% !important;
    }
    .t4p-fullwidth .caroufredsel_wrapper {
    width: 100% !important;
    }

    Thanks!

    Larkoll teamet
    Spectator
    Posts: 25
    July 29, 2015 at 9:36 am #19318

    Thanks now it is like I want 🙂