Private: Home › Forums › HTML Templates › Mixed Modern and Professional HTML Template › Centering Tab Headings › Reply To: Centering Tab Headings
February 26, 2015 at 12:09 am
#2269
Participant
Just figured it out. Here is how to do that:
add a class to the ul containing the headings of the hrizontal tabs ->
<ul class="tabs horizontal-centered">
in style.css under section “5.25 – Tabs Horizontal” after class named .tabs add the line below->
.tabs.horizontal-centered {padding: 0 10%;}
and after the class “.tabs li” the rules below must be placed->
.tabs.horizontal-centered li {width:25%;} //width percentage equals 100 divided by the number of tabs, for my case it is 4
following two lines must be added into the responsive css after “.tabs li” to keep things in place in mobile version:
.tabs.horizontal-centered {padding:0}
.tabs.horizontal-centered li {width:100%;}