Jump to content

How to give same width to td class


newcoder1010

Recommended Posts

Hello,

 

I have this html:

<table class="views-view-grid cols-4">
  
  <tbody>
       <tr class="row-1 row-first row-last">
            <td class="col-1 col-first"> .. </td>
	     <td class="col-2 "> .. </td>
            <td class="col-3 "> .. </td>
            <td class="col-4 col-last"> .. </td>
       </tr>
</tbody>
</table>

Currently, four columns took the full width of the screen which is fine. I would like to make changes:

 

1. Make it 22% of screen for each td class. Whether it is a laptop or desktop screen.

2. Give some space between each td class.

 

I tried this and did not work.

td 
{width: 22%;
margin:10px;
}

Please advise.

Edited by newcoder1010
Link to comment
Share on other sites

Tables are inflexible and are not capable of being responsive, you have to substitute it for something else. A table will never be smaller than the content within it even if you try to set its width.Table cells adjust to fit the size of the table they're in.

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...