HTML CSS examples for CSS Widget:Table
center all the elements of separate tables HTML
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .load {<!-- www . j a v a 2 s. com--> border-collapse:separate; border-spacing:131px 11px; text-align:center; } .mobile_title { margin-top:26px; font-size:26px; color:Chartreuse; margin-left:106px; font-family:'Oswald', sans-serif; } .text_under { font-size:16px; color:yellow; font-family:'Oswald', sans-serif; width:151; text-align:center; } td img { display:block; margin-left:auto; margin-right:auto; } </style> </head> <body> <table class="load"> <tbody> <tr> <td class="mobile_title">Lorem ipsum dolor </td> <td class="mobile_title">Lorem ipsum dol</td> <td class="mobile_title">Lorem ipsum dolor s</td> <td class="mobile_title">Lorem ipsum dolor</td> </tr> <tr> <td> <img src="https://www.java2s.com/style/demo/Google-Chrome.png" width="160" height="120"> </td> <td> <img src="https://www.java2s.com/style/demo/Safari.png" width="150" height="100"> </td> <td> <img src="https://www.java2s.com/style/demo/InternetExplorer.png" width="150" height="100"> </td> <td> <img src="https://www.java2s.com/style/demo/Firefox.png" width="150" height="110"> </td> </tr> <tr> <td class="text_under">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. Vestibulum tortor neque,</td> <td class="text_under">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. Vestibulum tortor neque, ornare vitae tempor hendrerit, luctus at</td> <td class="text_under">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. Vestibulum tortor neque, ornare </td> <td class="text_under">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. Vestibulum tortor neque, ornare vitae tempor</td> </tr> </tbody> </table> </body> </html>