Jump to content
Search In
  • More options...
Find results that contain...
Find results in...

How to make HTML table td to fill equal width Image is given

 

<div  style="width: 400px;">
    
    <table style="border:1px solid black;  margin: auto;"  cellspacing=0>
        <tr>
            <td colspan=3> sold by </td>
            <td colspan=3> date </td>
        </tr>

        <tr >
            <td colspan="5"> name </td>
        </tr>

        <tr>
            <td colspan="5">address</td>
        </tr>

        <tr>
            <td>row 4</td>
            <td>row 4</td>
            <td>row 4</td>
            <td>row 4</td>
            <td>row 4</td>
        </tr>

    </table>

    </div>

 

 

 

I am using colspan but then I realize what if we have 5column and just below we have two td and we want that to fill equally. Now I am confused how to do it. 

Here is the image I am not able to make the td of first row to take 50% width each..    

 

 

 

 

Sketch (24).png

Link to post
Share on other sites
Just now, Vinod Bahadur Thapa said:

 


<div  style="width: 400px;">
    
    <table style="border:1px solid black;  margin: auto;"  cellspacing=0>
        <tr>
            <td colspan=3> sold by </td>
            <td colspan=3> date </td>
        </tr>

        <tr >
            <td colspan="5"> name </td>
        </tr>

        <tr>
            <td colspan="5">address</td>
        </tr>

        <tr>
            <td>row 4</td>
            <td>row 4</td>
            <td>row 4</td>
            <td>row 4</td>
            <td>row 4</td>
        </tr>

    </table>

    </div>

 

 

 

I am using colspan but then I realize what if we have 5column and just below we have two td and we want that to fill equally. Now I am confused how to do it. 

Here is the image I am not able to make the td of first row to take 50% width each..    

 

 

 

 

Sketch (24).png

i used table width 100% and play with colspan and width but I am not getting it :( 

Link to post
Share on other sites
You could do something like that instead using CSS
table td:first-child {
  width: 50%;
}

 

 

Q: How many prolog programmers does it take to change a lightbulb?

A: Yes.

Link to post
Share on other sites
16 minutes ago, Vinod Bahadur Thapa said:

i used table width 100% and play with colspan and width but I am not getting it :( 

just do this

<tr>
            <td colspan=3 style="width: 50%"> sold by </td>
            <td colspan=3 style="width: 50%"> date </td>
        </tr>

Link to post
Share on other sites
11 minutes ago, Raghav Mahajan said:

just do this

<tr>
            <td colspan=3 style="width: 50%"> sold by </td>
            <td colspan=3 style="width: 50%"> date </td>
        </tr>

thanks but it is not working bro.

Link to post
Share on other sites
16 minutes ago, MathiasVN said:

You could do something like that instead using CSS

table td:first-child {
  width: 50%;
}

 

not working bro.

Link to post
Share on other sites
2 minutes ago, Vinod Bahadur Thapa said:

yes, but now the last row are not of equal width

do u know who to use flexbox

Link to post
Share on other sites
12 minutes ago, Raghav Mahajan said:

do u know who to use flexbox

 

15 minutes ago, Vinod Bahadur Thapa said:

yes, but now the last row are not of equal width

 

Link to post
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

×