Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

DIV table-cell width 100%

Tags:

html

css

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?

like image 232
user1995781 Avatar asked Nov 11 '13 09:11

user1995781


People also ask

How do you make a div 100 width?

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.

How do you make a full width occupy table?

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.

How do you increase cell width in a table?

To adjust column width automatically, click AutoFit Contents. To adjust table width automatically, click AutoFit Window.

How do I resize a table cell in HTML?

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.


2 Answers

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>
like image 100
Vivek Vikranth Avatar answered Nov 24 '22 00:11

Vivek Vikranth


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>
like image 29
Sridhar R Avatar answered Nov 24 '22 01:11

Sridhar R