Tabbed content - how to edit buttons?

I Need Help
1

I was searching for answers on forum but I didn’t get everything I needed so maybe somebody knows easy solution. I want to created two tabs list (tabbed content). Buttons should be simple text, no borders and in the middle of the page. After clicking text should stay underline or something similar like different background or wired round borders. Something for user to know what tab is activated.

I know how to get rid of the boarders via adding class .nav-link.active but I have no idea how to:

  1. center list tab
  2. make changes to mouse over behavior and after click behavior
2

Hi @piotrek
It really would be worth your money getting @Eldar courses. The last one was exactly on this subject.
I got loads done on my 2 pages with tabs and eliminated 4 other pages from my old site version.

3

I will look into this but I really need something basic here. Just two tabs with links to current projects and other one with links to already finished projects. I know how to do everything accept setting up behaviors for those two “buttons”.

4
  1. Select the first tab. Hold SHIFT, drag into the center using the left bar that shows on the tab. Adjust for all breakpoints.
  2. Make a custom class for the tabs. They can all have the same class. Adjust what you want based on NORMAL, HOVER and ACTIVE.

I hope this is what you were asking

1 Like
5

Hi @piotrek

There is some useful information for modifying tabs in this thread.

1 Like
6

Thanks guys I will try as soon as I can :slight_smile:

7
  1. It doesn’t work for list item, it’s only working for text but class: justify-content-center works fine
  2. Normal works all the time, Hover works ok but Active doesn’t work properly. It’s only works while I’m clicking button. After that it goes back to normal.