Home  >  Article  >  Web Front-end  >  How to solve the problem that the width setting of table cell td is invalid

How to solve the problem that the width setting of table cell td is invalid

php中世界最好的语言
php中世界最好的语言Original
2018-02-02 10:09:315039browse

This time I will bring you how to solve the problem of invalid width setting of table cell td. What should be solved if the width setting of table cell td is invalid? .
When making table pages, sometimes the width set for td is invalid. The width of td is always stretched by the internal content. You can set

padding

, but set the width directly. But it is invalid. Let's take a look at this example in detail:

<div> 
<table border="1px"> 
<tr> 
<td width="100px" style="width: 100px !important;">1000800</td> 
<td>1000000</td> 
<td>1000000</td> 
</tr> 
<tr> 
<td>1000000</td> 
<td>10000300</td> 
<td>1000000</td> 
</tr> 
</table> 
</div> 
<table border="1px"> 
<tr> 
<td width="100px">1000000</td> 
<td>1000000</td> 
<td>1000000</td> 
</tr> 
<tr> 
<td>1000000</td> 
<td>10000300</td> 
<td>1000000</td> 
</tr> 
</table> 
* {margin: 0; padding: 0;} 
.div1 {position: relative; width: 150px; height: 100px; overflow: scroll; border: 1px solid red;}
We can see that although the width of the first cell in class div1 is set, it is invalid. The content of the cell is always determined by the content, so since it is determined by the content, we have to find a way to let the "content" expand the cell, and that's it.

We can add a div in td, and then set the width of the div, let’s try it:

Modify part of the code in class div1:

<td width="100px" style="width: 100px !important;">1000800</td>

Modify For

<td><div>1000800</div></td>

and then write in the style:

td div { 
width:100px; 
}

I believe you have mastered the method after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!

Related reading:

htmlHow to control the properties of a hyperlink when opening a new window


Progressive enhancement in css3 And how to use graceful degradation


How should the new units vw, vh, vmin, vmax of css3 be used

The above is the detailed content of How to solve the problem that the width setting of table cell td is invalid. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn