[Solved] How to put this code into a table? [closed]

by 


<table>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
   "http://www.w3.org/TR/html4/frameset.dtd">
<html>
    <head>
        <title>
            Prueba
        </title>
    </head>
    <frameset rows="56px, *, 50px" border="0" framespacing="0" frameborder="NO">
        <frame class="header" src="https://stackoverflow.com/questions/10589097/header.html">
        <frameset cols="450px, *" border="0" framespacing="0" frameborder="NO">
            <frameset rows="*,150px" border="0" framespacing="0" frameborder="NO">
                <frame class="frame1" scrolling="auto" src="search_results.html">
                <frame class="frame2" scrolling="no" src="info.html">
            </frameset>
            <frame class="frame3" scrolling="no" src="map.html">
        </frameset>
        <frame class="footer" scrolling="no" src="footer.html">
    </frameset>
</html>
</table>

There.

But serious. You don’t want to use tables for layouting. Neither should you use frames.

The way to go would be to use divs. Or the new HTML5 elements.

Some new elements added to HTML are:

Sections elements

  • section
  • nav
  • article
  • aside
  • hgroup
  • header
  • footer
  • address

Grouping elements

  • figure
  • figcaption

Some benefits when not using tables for your layout:

  • tables render slower
  • tables don’t work too well when using a fluid design
  • tables are not the correct semantic elements to use for layout
  • tables are for tabular data
  • tables aren’t really flexible if you want to change your layout at some point

Please note that when you want to use the new HTML5 elements you should set the correct doctype:

<!DOCTYPE html>

Also note that ‘older’ browser (and IE) don’t know the new elements. To fix this issue you could add this simply JS script in the head of the document:

<script>
  document.createElement('header');
  document.createElement('nav');
  document.createElement('section');
  document.createElement('article');
  document.createElement('aside');
  document.createElement('footer');
  document.createElement('time');
</script>

What you would get is something like the following:

CSS

​#body { width: 960px; }
aside { width: 450px; float: left; }
.content { margin-left: 450px; }

HTML

<div id="body">
    <header>
        <h1>Your header</h1>
    </header>
    <aside>
        <p>Aside</p>
    </aside>
    <div class="content">
        <h2>Title</h2>
        <p>Some text</p>
    </div>    
    <footer>
        <p>Your footer</p>
    </footer>
</div>    ​

Demo

http://jsfiddle.net/ZGPAW/

3

solved How to put this code into a table? [closed]