Jump to content

TAB, TOGGLE HIDE AND SHOW OR WHAT?


MARCELO

Recommended Posts

Hello.

I m looking for something really similar to tabs like these

 https://www.w3schools.com/code/tryit.asp?filename=FOVNL36JZZ4W

But the idea is to have 4 buttons separated. I tried to change these tabs styles but i could not get what i wanted. Is it possible to work on the buttoms below to build a similar way to show content or there s a easier way?

 https://www.w3schools.com/code/tryit.asp?filename=FOVNSLTB3LZB

THANKS.

Link to comment
Share on other sites

Please stop making duplicate threads and stop using all capital letters in your titles.

You can prevent them from sticking together by removing the float:left rule from the .tab button selector. They're not blocks, so they don't need to be floated to be next to each other. You can also add space between them setting the margin property of the buttons.

Link to comment
Share on other sites

When it comes to tabs

1 - I want to establish a buttom size (the same of for each one) for all buttons. But the buttom size is proportional to the size of the word - as we can see here:

https://www.w3schools.com/code/tryit.asp?filename=FOYRAGU6HYUG

Is it possible to have only one buttom size for different size of words?

2 - In the same example (third buttom), is it possible to define the space between the lines (not line breaks br) ? Actually, this is a question i have wherever i am writing (buttom, text, etc).

3 - It seems there s a shadow in the right of the buttons. How do i remove it?

 

THANKS.

Edited by MARCELO
Link to comment
Share on other sites

You can remove the shadows from the buttons by setting the border width to zero. You can make all the buttons the same width by setting their width property. You can choose the spacing between lines using the line-height property, if you want to reduce the spacing, remove the margins from your buttons.

You should check the CSS reference page to look for properties that might solve your problems whenever you have a question.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...