Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • December 14, 2017 at 1:00 pm #888859
    jshughes2013

    Hi
    I am trying to design my page to a layout in 3 columns similar to this page on another website

    MFE SelfCooking Centre® XS

    As you can see this has three columns 1 image,I header and text description,right sidebar with smaller width red section inset for product categories. That is similar to what I want to acheive. However my best efforts to have the red categories section are in the link below. How can I have the layout similar to the link above.

    Test Brian 3

    Thanks

    James

    December 14, 2017 at 5:18 pm #888979
    Victoria

    Hey jshughes2013,

    You need to have a sidebar and those are product categories which are added by a widget. And your page is full-width, without a sidebar.

    Best regards,
    Victoria

    December 14, 2017 at 5:47 pm #888999
    jshughes2013

    Hi Victoria

    When I tried to add a sidebar it would only appear at the bottom right (or left if i chose) see this link where ”categories” are.

    test brian 4

    Thanks

    James

    December 14, 2017 at 6:54 pm #889036
    Victoria

    Hi James,

    This color section does not allow the sidebar to be higher. You can remove it and use the 1/1 element and put the same content in it.

    Best regards,
    Victoria

    December 14, 2017 at 9:29 pm #889096
    jshughes2013

    Thanks Victoria

    How can I put a colour background category submenu inside this sidebar without the background colour taking up all of the sidebar?

    James

    December 15, 2017 at 12:33 am #889148
    Jordan Shannon

    Hi,

    You would just need to target the class or id of the category sub-menu.

    Best regards,
    Jordan Shannon

    December 16, 2017 at 9:13 pm #889697
    jshughes2013

    Could you give me an example on how to do this Jordan?

    Thanks

    James

    December 17, 2017 at 1:17 am #889728
    Mike

    Hi,
    Please see screenshot in Private Content area, you will see that the classes: “.flex_cell.avia-builder-el-7” make up the whole column, while “.flex_cell_inner .avia-builder-el-8 ” make the area you would like red.
    So for example:

    .flex_cell_inner .avia-builder-el-8 {background-color: red !important;}

    Best regards,
    Mike

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