Home In Mozilla Firefox the html tables do not work in a two-column div container
Reply: 0

In Mozilla Firefox the html tables do not work in a two-column div container

user7553
1#
user7553 Published in June 19, 2018, 4:30 pm

In Mozilla Firefox the html tables do not work in a two-column div container.

In other browsers when we have a table in a container with two columns, the table is cut in the first column and continues in the next column, in the case of Mozilla it is still in the same column.

I leave an example html code with this case so you can try it with different browsers and see my problem.

Thank you all. A greeting

<html lang="en-US"><head>
	<meta charset="UTF-8">
	<meta name="robots" content="noindex, nofollow">
	<title>CSS Columns example</title>
	<link href="//fonts.googleapis.com/css?family=Open+Sans:400" rel="stylesheet" type="text/css">
    <style>
    body {
    	margin: 40px;
    }
    .content {
        column-count: 2;
    	-moz-column-count: 2;
    	-webkit-column-count: 2;
    	column-gap: 60px;
		-moz-column-gap: 60px;
		-webkit-column-gap" 60px;
    }
    </style>
</head>
<body>

	
	<div class="content"> 
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent nulla nisi, cursus eget tristique non, volutpat quis odio. Cras eleifend volutpat arcu, vel sagittis lorem semper id. Aliquam ex enim, ultrices non ex ut, congue tincidunt metus. Morbi eget aliquet risus. Sed id sapien ex. Nam quis velit quis lectus porta placerat eget nec felis. Ut ac condimentum elit, id tristique mauris. Pellentesque tincidunt vulputate turpis ut pulvinar.
</p>
<p>
Cras nec mauris vel urna ultrices placerat. Fusce volutpat tortor dapibus hendrerit elementum. Aenean eget sollicitudin nisi, ut egestas enim. Vivamus sit amet facilisis ante. Aliquam erat volutpat. Maecenas vitae magna at est egestas lobortis. Quisque ultricies porta nisl. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque tempus diam ex, a varius nibh hendrerit nec. Praesent blandit nisl id nisl lobortis commodo. Aliquam sagittis blandit lectus. Etiam lorem felis, accumsan et pellentesque eu, finibus vel metus. Curabitur eu ipsum non eros porta facilisis. In hac habitasse platea dictumst. Nunc a felis justo. Quisque bibendum lorem lorem, quis porta nunc fringilla sed.
</p><table style="width:100%">
  <tbody>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
    <tr>
    <td>Jill</td>
    <td>Smith</td> 
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
  </tr>
</tbody></table>
<p>
Donec dignissim dui neque, non mollis dolor molestie in. Fusce at porta ligula. Quisque ac pellentesque justo, vel venenatis augue. Aliquam at felis vitae massa consequat tempor ac in metus. Sed sit amet fringilla nulla, sit amet lobortis erat. Phasellus tellus sapien, convallis nec dui sed, sagittis euismod urna. Donec a metus lorem. Nam lorem justo, mattis ac sapien at, sollicitudin viverra magna. Donec laoreet lacus sit amet venenatis bibendum. Cras at ipsum vel elit luctus hendrerit vel eget ligula. Praesent ac neque in nunc molestie dapibus nec ut orci. Vestibulum efficitur vitae est id laoreet. Proin quis quam sit amet ipsum eleifend feugiat. Vestibulum odio felis, sagittis ut magna sit amet, fermentum lobortis magna.
</p>
<p>
Proin nec purus nulla. Morbi in venenatis quam, ac ultrices ante. Cras dictum fermentum malesuada. Donec tortor nisi, rhoncus vitae accumsan a, lobortis quis est. Curabitur quis augue vitae diam tristique cursus sit amet ut nulla. Sed sem justo, sagittis a sodales vitae, tincidunt nec nibh. Quisque sem enim, ullamcorper sit amet scelerisque non, auctor quis odio. Aenean vitae gravida nunc. Nullam vel ipsum nibh. Proin ullamcorper pretium vehicula. Fusce ac tellus eget orci rutrum malesuada. Proin eget ante metus. Suspendisse finibus maximus erat at rutrum.
</p>
<p>
Phasellus a tellus ut nisi lobortis commodo. Suspendisse lorem ante, hendrerit et leo vitae, eleifend ullamcorper nunc. Vivamus pellentesque purus enim, sed finibus neque posuere eget. Praesent arcu nibh, consectetur nec lobortis in, tristique quis lorem. Suspendisse sed feugiat turpis. Vestibulum convallis vitae sem sed cursus. Aenean fringilla urna non interdum varius. Etiam tristique mauris sapien, ultrices blandit leo auctor in. In hac habitasse platea dictumst. Integer pharetra magna sed dui suscipit sodales. Suspendisse a pretium urna, a finibus ligula. Quisque non massa ut sapien auctor vehicula eu eu ante.
</p>
	</div>


</body></html>

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.311895 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO