• [ Moderator note: moved to Fixing WordPress. Please do not use Developing With WordPress for these topics. ]

    Hello,

    Recently I started making a webshop with woocommerce using the i-craft theme. This is going beyond my expectations because I have 0 experience with CSS, PHP or HTML. The theme looks good however I would like to change the utility bar to the full width of the page. How will I be able to accomplish this? The site is: https://www.dadelstore.nl

    .ubarinnerwrap {
    margin: 0px auto;
    max-width: 1264px;
    padding: 100% 32px;
    }
    .utilitybar {
    display: block;
    border-bottom: 1px solid #e7e7e7;
    height: 36px;
    line-height: 32px;
    padding: 0px;
    vertical-align: middle;

    background-color: #676767;
    color: #FFFFFF;

    • This topic was modified 7 years, 8 months ago by dadelstore.
    • This topic was modified 7 years, 8 months ago by Jan Dembowski.
Viewing 5 replies - 1 through 5 (of 5 total)
  • Hello there,

    Your theme has defined the max-width of the page 1200px. To set the utility bar in full width add the following custom CSS to customize-> Additional CSS

    .nx-boxed .site {
        max-width: 100%;
    }
    .other-slider {
        width: 1200px;
        margin: 0 auto;
    }

    Hope it helps and let me know if you require any further assistance.

    Thread Starter dadelstore

    (@dadelstore)

    Hello Poonam, thank you for your reply. When I paste the code in the additional CSS section, nothing changes for some reason…

    keep your bar out in this id=”page” DIV

    I can’t find the given CSS when I inspect the element.

    Thread Starter dadelstore

    (@dadelstore)

    Thank you! It works :). However I’m experiencing another problem which I can’t find on this forum. Namely the “log in” button in my header menu. It leads towrds the login page of wordpress. This is something I do not want to show on the website, how can I turn this off?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Utility Bar full width’ is closed to new replies.