MARCELO Posted February 27, 2018 Share Posted February 27, 2018 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 More sharing options...
Ingolme Posted February 28, 2018 Share Posted February 28, 2018 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 More sharing options...
MARCELO Posted March 2, 2018 Author Share Posted March 2, 2018 (edited) 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 March 2, 2018 by MARCELO Link to comment Share on other sites More sharing options...
Ingolme Posted March 2, 2018 Share Posted March 2, 2018 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 More sharing options...
dsonesuk Posted March 2, 2018 Share Posted March 2, 2018 If you want buttons the same size i.e height and width, look into use flex https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_flex Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now