This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Second Level Menu (Submenu) first element triangle on top

Resolved 3 replies premiumthemetheme-vantage
Jose AMezcua
11 years ago · Last reply by Daniel 11 years ago

Hello Site Origin Team,

I have been looking around the support threads and could not find anything related to this, I hope it can be done using just CSS.

I would like to have an arrow/triangle at the top of the first element of the submenu pointing to its parent. Just like this: http://mylo.com.mx/wp-content/uploads/2015/02/Screen-Shot-2015-02-22-at-9.58.36-PM.png

Thanks in advance!
J.

URL: http://mylo.com.mx

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Daniel Staff 11 years, 2 days ago

    Hi Jose,

    First of all I apologize for the delayed response. Try placing the following css in the custom css section

    li#menu-item-96:after, li#menu-item-96:before {
	bottom: 100%!important;
	left: 30%!important;	
	border: solid transparent!important;
	content: " "!important;
	height: 0!important;
	width: 0!important;
	position: absolute!important;
	pointer-events: none!important;
}
li#menu-item-96:before {
	border-bottom-color: #F15A24!important;
	border-width: 8px!important;
	margin-left: -36px!important;
}
li#menu-item-56:after, li#menu-item-56:before {
	bottom: 100%!important;
	left: 30%!important;	
	border: solid transparent!important;
	content: " "!important;
	height: 0!important;
	width: 0!important;
	position: absolute!important;
	pointer-events: none!important;
}
li#menu-item-56:before {
	border-bottom-color: #F15A24!important;
	border-width: 8px!important;
	margin-left: -36px!important;
}
li#menu-item-59:after, li#menu-item-59:before {
	bottom: 100%!important;
	left: 30%!important;	
	border: solid transparent!important;
	content: " "!important;
	height: 0!important;
	width: 0!important;
	position: absolute!important;
	pointer-events: none!important;
}
li#menu-item-59:before {
	border-bottom-color: #F15A24!important;
	border-width: 8px!important;
	margin-left: -36px!important;
}
li#menu-item-61:after, li#menu-item-61:before {
	bottom: 100%!important;
	left: 30%!important;	
	border: solid transparent!important;
	content: " "!important;
	height: 0!important;
	width: 0!important;
	position: absolute!important;
	pointer-events: none!important;
}
li#menu-item-61:before {
	border-bottom-color: #F15A24!important;
	border-width: 8px!important;
	margin-left: -36px!important;
}

    Try that out

    Cheers

  2. Jose AMezcua 11 years, 2 days ago

    Hello Addo,

    don’t worry about the timing, it works like magic! Awesome.

    Thanks for the help and have a great day!
    J

  3. Daniel Staff 11 years, 1 day ago

    You are welcome Jose!

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread