iframe within table?

pgaec · Feb 9, 2005

Here is a screen shot of what i would like to achieve:

The top section (header) will just display an banner image. The main section needs to be split into two frames (one for the menu and the other for the main page.

Here's the code for the header(banner). [I've created a rounded rectangle in photoshop & have sliced them up as top_left.jpg, top_middle.jpg etc...]

Code:

<table>
<tr>
    <td><img src="top_left.jpg" height="20" width="20"/></td>
    <td><img src="top_middle.jpg" height="20"/></td>
    <td><img src="top_right.jpg" height="20" width="20"/></td>
</tr>
<tr>
    <td><img src="middle_left.jpg" width="20"/></td>
    <td><img src="banner.jpg"/></td>
    <td><img src="middle_right.jpg" width="20"/></td>
</tr>
<tr>
    <td><img src="bottom_left.jpg" height="20" width="20"/></td>
    <td><img src="bottom_middle.jpg" height="20"/></td>
    <td><img src="bottom_right.jpg" height="20" width="20"/></td>
</tr>
</table>

The header (banner) works fine. Now i would like to do the same for the main content. However, my main body displays two frames ie., menu.html and main.html. How can I do this?

<table>
<tr>
<td><img src="top_left.jpg" height="20" width="20"/></td>
<td><img src="top_middle.jpg" height="20"/></td>
<td><img src="top_right.jpg" height="20" width="20"/></td>
</tr>
<tr>
<td><img src="middle_left.jpg" width="20"/></td>
<td>Insert frames here</td>
<td><img src="middle_right.jpg" width="20"/></td>
</tr>
<tr>
<td><img src="bottom_left.jpg" height="20" width="20"/></td>
<td><img src="bottom_middle.jpg" height="20"/></td>
<td><img src="bottom_right.jpg" height="20" width="20"/></td>
</tr>
</table>

Any suggestions/ideas ?

glenmac · Feb 9, 2005

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/frameset.dtd">[/URL] 

<html>
 <head>
  <title>TestFrame</title>


 </head>

<frameset rows="119,*" frameborder="0" framespacing="0">
  
     <frame name="banner" noresize src="top.html" scrolling="no">
  

  <frameset cols="190,*" frameborder="0" >
     <frame noresize src="side.html" scrolling="no">
     <frame name="MainFrame" scrolling=yes noresize src="welcome.html">
  </frameset>

<noframes>
 So sorry but your browser will not display this beautiful frame page<br>
But you can go here <a href="frame1.html">instead</a>
</noframes>

</frameset>

Is this what you mean?

Glen

http://lantzvillecomputers.ca

CliveC · Feb 9, 2005

Glen's ideas sounds good. However if you want to maintain (ie. not scroll) the rounded top and bottom borders, you would need to make them a part of the header & footer respectively. The tables can go completely and you need a 1px high middle left slice, and a 1px middle right slice that both repeat vertically for a background in the body of the MENU and MAIN frames.

This is a frameset as opposed to an iframe.

I would also recommend using a link to menu.html in the noframes tag. This will maintain the basic workability of the pages outside of the frameset.

Code:

<html>
<frameset rows="50px,*,20px" frameborder="0">
 <frame src="head.html" name="HEAD" scrolling="no" />
 <frameset cols="25%,*" frameborder="0">
  <frame src="menu.html" name="MENU" scrolling="no" />
  <frame src="main.htm"  name="MAIN" scrolling="YES" />
 </frameset>
 <frame src="foot.html" name="FOOT" scrolling="no" />
</frameset>
</html>

Clive

http://tubularity.com

http://PalliativeCareConsulting.org

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

iframe within table?

pgaec

Programmer

glenmac

Technical User

CliveC

Programmer

Similar threads

Part and Inventory Search

Sponsor