Let's go back to something a wee bit simpler.

    <FRAMESET COLS="50%,50%">
      <FRAME SRC="lisa.html">
      <FRAME SRC="terri.html">
    </FRAMESET>

VIEW IT

We can put pictures in the frames if we want to. Grab the picture at left and save it into your working folder as `world.gif`. (Right click and choose Save Image As)

    <FRAMESET COLS="50%,50%">
      <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162>
      <FRAME SRC="terri.html">
    </FRAMESET>

VIEW IT
Remember it is always good practice to include `HEIGHT` & `WIDTH` attributes for any image tag.

Let's try to frame the picture nice and neat. First shrink the left window to 146 pixels wide. Since we are using an absolute dimension should make the other frame elastic.

    <FRAMESET COLS="146,*">
      <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162>
      <FRAME SRC="terri.html">
    </FRAMESET>

VIEW IT

Next we will divide the left frame horizontally into 2 sections. The top section to be 162 pixels high and the bottom section to be whatever is left over. We will put in `world.gif` and Lisa respectively.

    <FRAMESET COLS="146,*">
      <FRAMESET ROWS="162,*">
        <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162>
        <FRAME SRC="lisa.html">
      </FRAMESET>
      <FRAME SRC="terri.html">
    </FRAMESET>

VIEW IT
As you can see, we have a bit of a problem.

<< BACK NEXT >>