Tabs GK5 : Rotate font awesome symbol in Tab Title

hinki123

After my great experience last time here in this forum I'm hopefully back with the next question.

I'm trying to rotate the font awesome symbol in the Tab-Title but doesn't succeed 'til now.

Hope somebody can help me please

What I tried so far (the symbol in tab-1 shall rotate 270 deg):

.gkTabsWrap ol li.gkTabs-1::after{content: "\f030";
		transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        -moz-transform: rotate(270deg);}
.gkTabsWrap ol li.gkTabs-2::after{content: "\f030";}
.gkTabsWrap ol li::after{font-family: FontAwesome;font-size: 30px;} /*change font-size accordingly */

Thank you in advance.

Kind regards

paulus1031

I'm not 100% what item you want to rotate - can you add a screenshot pointing to the element in question

Thanks
Paul

hinki123

paulus1031

Hi,

it is the element in the first tab (left one), I want to rotate.

Thank you

aman204

hinki123 You can try change this :


.gkTabsWrap ol li.gkTabs-1::after{content: "\f030";
		transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        -moz-transform: rotate(270deg);}

.gkTabsWrap ol li.gkTabs-1::after{content: "\f030";
display:inline-block;
		transform: rotate(270deg);
        -webkit-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        -moz-transform: rotate(270deg);}

hinki123

Yeah, it works.

That's really really great!

Thank you so much.

hinki