Two pages of a column with fields

I don’t know where to start learning about such a layout without tables or at most one column table as a simple container. Where to begin?

+3
source share
1 answer

So, after seeing your comment about finding a layout with two columns of fields, I went and wrote this without using tables:

<html>
<head>
<title>Two Column Fieldsets</title>

<style>
html, body
{
  background: #156;
  text-align: center;
}

#container
{
  background: #FFF;
  border: 1px #222 solid;
  height: 600px;
  margin: 0 auto;
  text-align: left;
  width: 700px;
}

#container form
{
  margin: 0 auto;
}

label
{
  float: left;
  width: 50px;
}

.singleRow
{
  float: left;
  width: 322px;
}

</style>

</head>
<body>
<div id="container">
  <form action="">
    <fieldset class="singleRow">
      <label for="1">Text:</label>
      <input id="1" type="text" />
      <input type="submit" value="submit" />
    </fieldset>
    <fieldset class="singleRow">
      <label for="2">Text:</label>
      <input id="2" type="text" />
      <input type="submit" value="submit" />
    </fieldset>  
  </form>
</div>
</body>
</html>

, . - . .singleRow, float: left; ( , ). ( , div li s, ) , , , -column layout.

, .

+6

Source: https://habr.com/ru/post/1709443/


All Articles