Here is my code:
<div style='display: table'>
<div style='height:200px; width:100%; text-align: center; display: table-cell; vertical-align: middle'>No result found</div>
</div>
Why is that the width:100%
is not working? How can I solve it?
The width property is used to fill a div remaining horizontal space using CSS. By setting the width to 100% it takes the whole width available of its parent. Example 1: This example use width property to fill the horizontal space. It set width to 100% to fill it completely.
You need to set the margin of the body to 0 for the table to stretch the full width. Alternatively, you can set the margin of the table to a negative number as well. Save this answer.
To adjust column width automatically, click AutoFit Contents. To adjust table width automatically, click AutoFit Window.
To manipulate the height or width of an entire table, place the size attribute (either "WIDTH=" or "HEIGHT=") within the <TABLE> code. To manipulate individual cells, place the size attribute within the code for that cell.
Try giving width: 100%
to parent so that the child has full width.
<div style='display: table; width:100%; background:#f00;'>
<div style='height:200px; width:100%; text-align: center; display: table-cell; vertical-align: middle'>No result found</div>
</div>
Try this. Container div must be 100%. Then we can set to child's
<div style="display: table; width: 100%;">
<div style="height: 200px; text-align: center; display: table-cell; vertical-align: middle; width: 100%;">No result found</div>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With