Home › Forums › WoodMart support forum › Border bottom – Main header

Border bottom – Main header

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • November 6, 2019 at 7:03 pm #155267

    d_ch
    Participant

    Hi,

    Is it possible to have border bottom of main header appeared as boxed (to have the same width as content and not to be appeared full width)? Even if I select the option Container–>Boxed at Border bottom options, it is still appeared full width.

    Thank you in advance.

    Attachments:
    You must be logged in to view attached files.
    November 7, 2019 at 7:40 am #155328

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    You can try the “Header Sweets Bakery Overlap” as your default header. It designed in the boxed layout except of full width.

    Screenshot: https://jmp.sh/9ON1SAC

    Result: https://jmp.sh/SfmmOVu

    If you do not have “Header Sweets Bakery Overlap“. You can import your headers by following the below documentation: https://xtemos.com/docs/woodmart/header-builder/how-to-exportimport-headers/

    Best Regards.

    November 7, 2019 at 8:19 am #155342

    d_ch
    Participant

    Hi,

    I think you didn’t understand my question. I don’t want to have my main menu into a box, I just want to have to have my border bottom of my main header to be appeared as “top-divider” between logo and main menu but not fullwidth (for example like on the website https://pimpstreetwear.gr/).
    I just want the border to be appeared like at my attached screenshot.

    Attachments:
    You must be logged in to view attached files.
    November 7, 2019 at 12:19 pm #155411

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    I got your point. Kindly provide your login details so I can check that is it possible to limit the border length in that header which you currently using or not.

    Best Regards.

    November 7, 2019 at 12:23 pm #155413

    d_ch
    Participant

    Hi,

    Please find attached my login details.

    You can also check another website with my desired border appearance here:

    https://www.patousakishoes.gr/

    Thank you in advance.

    November 7, 2019 at 1:59 pm #155447

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    To display the border as like the attachment you shared. You can use the below CSS in Theme Setting >> Custom CSS >> GLobal CSS section:

    .whb-general-header {
    margin-left: 8%;
    margin-right: 8%;
}

    Result: https://jmp.sh/Wrxg2IR

    Best Regards.

    November 7, 2019 at 2:14 pm #155449

    d_ch
    Participant

    Hi,

    I tested your code but I think it doesn’t work correctly like on my reference website. Please check my attached screenshots. You will see that the border doesn’t follow the content correctly to the different screen-sizes. In addition, at mobile version of the website main header overlaps the home slider.

    Attachments:
    You must be logged in to view attached files.
    November 7, 2019 at 2:35 pm #155462

    Aizaz Imtiaz Awan
    Keymaster

    Hello

    Move that CSS code to Custom CSS for desktop from Global Custom CSS from Theme Settings >> Custom CSS.

    Best Regards.

    November 7, 2019 at 5:37 pm #155512

    d_ch
    Participant

    I moved it to Custom CSS for desktop as per your advice but I still have the same appearance for screen sizes bigger than 1024px. Border is not adapted accordingly (it doesn’t have the same width with content of top bar and home slider). Please check my attached screenshots.

    Attachments:
    You must be logged in to view attached files.
    November 8, 2019 at 7:25 am #155609

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Your issue has been solved. I have disable the header bottom border and add the border with custom CSS code added in Theme Settings >> Custom CSS >> Custom CSS for desktop section.

    Please check your site now after removing the browser cache.

    Best Regards.

    November 8, 2019 at 8:12 am #155630

    d_ch
    Participant

    I checked the site and indeed the border is appeared correctly now at desktop version of the site but it is not appeared on tablet & mobile versions.

    Is it possible someway to have the border appeared at the above versions of the website too (to have the same width with content of home slider as it is appeared currently on desktop version)? Please check my attached screenshots.

    Attachments:
    You must be logged in to view attached files.
    November 8, 2019 at 10:44 am #155678

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Please check your site now, I have moved the custom Code in the Global Custom CSS section.

    Best Regards.

    November 8, 2019 at 11:16 am #155691

    d_ch
    Participant

    Thank you very much!

    November 8, 2019 at 11:18 am #155692

    Aizaz Imtiaz Awan
    Keymaster

    Well, d_ch!.., it’s been great chatting with you! I hope I resolved your issues thoroughly.

    Let us know if there’s anything else we can do for you! You can always reach us at any time. We are always here to help you.

    Have a wonderful day.

    Topic Closed.
    Best Regards.

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)

The topic ‘Border bottom – Main header’ is closed to new replies.