ElieGator

@tuanphan Thank you so so much for your help ! I am sorry though but I am not sure I understand the code. It doesn't seem to work. Should I fully remove the codes I already have and add this code you gave me or should it just me modified. This is the code I have been using that works perfectly for the desktop version : <style> #header .header-nav-item:nth-child(1) {display:none} #header .header-nav-item:nth-child(2) {display:none} #header .header-nav-item:nth-child(3) {display:none} #header .header-nav-item:nth-child(4) {display:none} #header .header-nav-item:nth-child(10) {display:none} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(1) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(2) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(3) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(4) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(10) {display:none}} </style>

Hi there @tuanphan I've been following so many of your posts ! You're amazing ! It's been super helpful. I do indeed still need some help though. I still can't figure out why my dropdown menu on the Mobile doesn't display all my services. In EN it displays the first 3 pages and in FR in displays only the last 2. On both languages it should display 5 services on each. I don't know if that makes sense. It's find on desktop but it doesn't work on Mobile. Any idea what I did wrong ? Thank you so so much for your help !!

Site URL: https://www.lesmenagers.ca/ Hey there, The dropdown menu of my "Services" section in both EN and FR are not complete aaaand for both language it's showing different info. For the EN version it's showing the first 3 linked page under that menu and for the FR version it's showing the last 2 linked pages. There is a total of 5 pages... Sooo I am assuming there is something in my custom CSS coding that's off. Can someone please please help me. Here's what I entered in my custom CSS for the Bilingual coding : for EN pages <style> #header .header-nav-item:nth-child(5) {display:none} #header .header-nav-item:nth-child(6) {display:none} #header .header-nav-item:nth-child(7) {display:none} #header .header-nav-item:nth-child(8) {display:none} #header .header-nav-item:nth-child(9) {display:none} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(5) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(6) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(7) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(8) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(9) {display:none}} </style> for FR pages <style> #header .header-nav-item:nth-child(1) {display:none} #header .header-nav-item:nth-child(2) {display:none} #header .header-nav-item:nth-child(3) {display:none} #header .header-nav-item:nth-child(4) {display:none} #header .header-nav-item:nth-child(10) {display:none} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(1) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(2) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(3) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(4) {display:none}} @media screen and (max-width:1511px){#header .header-menu-nav-item:nth-child(10) {display:none}} </style> Thank you so much !