Customize the menu of Layout 9.

Home Documentation How To Customize the menu of Layout 9.

The below edits will allow you to customize the menu of Layout 9 (add lines and control the width of the menu).

 

 

1) Log into your App Manager and select your app.

2) Click Colors from the left-hand-side of the screen (or the middle of the screen).

3) Scroll down to the Advanced CSS box and enter the following code. If there is already code in the advanced SCSS box, do not remove it.  Start a new line “after” the last character in the box, then paste the code below.

/** Begin add lines to layout 9 menu*/
.layout.l9 ul.items li {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items:center;
border-bottom-width: 1px;
border-bottom-style: solid;
}
.layout.l9 li img {
margin: 0 0 0 10px;
}
.layout.l9 ul.items li p {
margin: 0 0 0 10px;
}
/** End add lines to layout 9 menu*/

 

NOTE: The “box-bottom-width” is the size of your border. The line “margin” is for the space between different elements.

 

Comments are closed.