topic Re: Need to change Horizontal Menu to Vertical Menu in QlikView

Need to change Horizontal Menu to Vertical Menu

Thu, 02 Mar 2017 11:49:57 GMT

Hi all,

I did horizontal menu(Drop down menu ) using dropDown Extension.

But i need to change it to vertical menu.

PFA

thanks,

Swathi

Re: Need to change Horizontal Menu to Vertical Menu

vishsaggi — Thu, 02 Mar 2017 20:46:38 GMT

Once you load the extension you have some extension fiels like css and Js...etc. In that go to

tinydropdown.css file -> Right click and edit -> Then look for these two lines

.menu {list-style:none; font:16px Arial,Verdana; text-align:left; width:600px; margin:0 auto}

.menu li {position:Relative; float:bottom; width:120px; z-index:1000}

I am not sure if this is what you are looking for, may be worth a shot.

Re: Need to change Horizontal Menu to Vertical Menu

Mon, 06 Mar 2017 06:32:11 GMT

thank u nagaraju its workig

Re: Need to change Horizontal Menu to Vertical Menu

vishsaggi — Mon, 06 Mar 2017 14:52:33 GMT

Glad it worked for you. Can you close the thread accordingly.

Re: Need to change Horizontal Menu to Vertical Menu

KasperJeppesen1 — Mon, 11 Jan 2021 17:44:49 GMT

Hi @vishsaggi

Do you know a solution that works for qlik sense ? I need to change the horisontal menu in a container, to a vertical. As in the image below.

Thank you!

Re: Need to change Horizontal Menu to Vertical Menu

vishsaggi — Mon, 11 Jan 2021 18:43:04 GMT

Did you try the same options in Qliksense? As I mentioned earlier.

Re: Need to change Horizontal Menu to Vertical Menu

KasperJeppesen1 — Mon, 11 Jan 2021 20:48:16 GMT

@vishsaggi

I did yes. Below is my css which I have used based on your suggestion.

.qv-object-container ul{
list-style:none !important;
text-align:left !important;
width:120% !important;
margin:0 auto !important;
background-color: red;
}

.qv-object-container li{
position:Relative !important;
float:bottom !important;
width:100% !important;
z-index:1000 !important;
}

I tried to overwrite Qlik-sense's rule with !important, but without success. I tried to write all the css within only the ul tag and li tag, but did not work either. The "background-color: red;" were used to test, if anything happened at all. It managed to color the background red, so it is a bit confusing. I have tried all kind of things before I replied to your answer.

Do you have any suggestions?

Thank you!