Tengo una página que, en ciertos anchos de pantalla, requiere desplazamiento horizontal. Hacia un extremo de la página, tengo un menú desplegable con objetos Primeng MenuItem , configurado para mostrar información sobre herramientas. El problema es que, si el menú desplegable está fuera de la pantalla de forma predeterminada y el usuario se desplaza hacia la derecha, la información sobre herramientas aparece donde estaría el borde de la pantalla sin desplazarse (es decir, aparece un poco más a la izquierda, pasando el mouse sobre nada en particular). ). Esto sucede independientemente de cómo esté configurada la propiedad appendTo o positionStyle de la información sobre herramientas.

fragmento html:

 <dropdown #dropdownMenu [options]="dropdownOptions"></dropdown>

fragmento mecanografiado:

 @ViewChild('dropdownMenu') dropdown: DropdownComponent; dropdownOptions: MenuItem<Thing>[]; /* Bunch of other code */ this.dropdownOptions = [ { label: "Item the first", command: (thing: Thing) => this.doThingWithThing(thing), tooltipOptions: { tooltipLabel: "This is the first item in the list", appendTo: "dropdownMenu", // also tried with this.dropdown, same result positionStyle: "relative", tooltipPosition: "left" }, { label: "Item the second", command: (thing: Thing) => this.doOtherThingWithThing(thing), tooltipOptions: { tooltipLabel: "This is the second item in the list", appendTo: "dropdownMenu", positionStyle: "relative", tooltipPosition: "left" }, // and so on ]

¿Qué debo hacer para que la información sobre herramientas aparezca adjunta al menú desplegable y no sobresalga de donde estaría el borde de la pantalla si el usuario no se hubiera desplazado?