How to Create Full size HTML Tables? (No margins, Full Window)

22,763

This should do it:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Pagina nueva 4</title>
<style>
  body {
    margin: 0px;
    padding: 0px;
  }
  .container {
    width: 100%;
    min-height: 567px;
    padding: 0px;
    border: 3px solid #FF0000;
  }
  .container .content {
    background-color: #008080;
  }
  .container .sidebar {
    background-color: #000000;
    width: 160px;
  }
</style>
</head>

<body>

<table class="container">
<tr>
    <td class="content">&nbsp;</td>
    <td class="sidebar">&nbsp;</td>
</tr>
</table>

</body>

</html>
Share:
22,763
Jmlevick
Author by

Jmlevick

Hello there! My name is Manuel and I'm a software developer from México. I mostly like building stuff for the web as my favorite programming language is Javascript but I'm no stranger to other languages and core/advanced concepts of programming. My skills are mostly focused on application design (archiecture) and quick prototyping; As a Fullstack Developer I can work on both the frontend and/or backend without any hassles and quickly recognize problems to set a course of action for correction. I'm good working by myself or with a team either with me as a leader or learning from others. Focal points of interest right now: Real time apps, Concurrency, Data Analysis, Decentralized Apps (Blockchain) and projects that can be quickly built with the technologies I know best. TL;DR I like building awesome stuff, solving intriguing puzzles and learning everything I can in the process with the goal of making a difference for good out there. Nice to meet you.

Updated on August 23, 2020

Comments

  • Jmlevick
    Jmlevick over 3 years

    I want to create a basic two columns layout in HTML with a table, but I want the table to "occupy" the FULL PAGE. without margins ("white spaces" between borders and browser's window), let me be more clear with an example:

    <html>
    
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>Pagina nueva 4</title>
    <meta name="Microsoft Theme" content="none">
    </head>
    
    <body>
    
    <table border="4" width="100%" height="567" style="border-collapse: collapse; border: 3px solid #FF0000" bordercolorlight="#FF0000">
    <tr>
        <td bgcolor="#008080">&nbsp;</td>
        <td width="160" bgcolor="#000000">&nbsp;</td>
    </tr>
       </table>
    
       </body>
    
       </html>
    

    As you can see there, we have a green table with a black sidebar and red borders, all on top of a white background. The thing is, I want the borders to be "absolute" without having white space between user's browser window and them. I want the table to occupy the Full Page without spaces or "margins" or whatever they are, sorry for being redundant.

    How can I do that?