Converting Frames page to iframe

I have my website is a frame based site, and I want to change to iframe as frames are going to be deprecated soon (It is already not supported in HTML5), I know it is not one to one transfer, but I do not see how it is possible to define columns and rows, my old frame page is:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
   "http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<FRAMESET cols="10%, 90%">
  <FRAMESET rows="10%, "90%">
      <FRAME name="status" id="status" src="no-status.html" scrolling="no" noresize="noresize" frameborder="0">
      <FRAME  name="menu" id="menu" src="no-menu.html"  scrolling="no" noresize="noresize" frameborder="0">
  </FRAMESET>
  <FRAMESET rows="20%, "80%">
      <FRAME name="logo" id="header" src="header.php"  scrolling="no" noresize="noresize" frameborder="0">
      <FRAME  name="main" id="main" src="login.php"  scrolling="yes" noresize="noresize" frameborder="0">
  </FRAMESET>
  <NOFRAMES>
      Sorry, your browser does not handle frames!
  </NOFRAMES>
</FRAMESET>
</HTML>

Open in new window


   My new iframe file:
<html>

<head>
<title>HTML Test</title>
</head>

<body>
      <iframe name="top" id="top" width="100%" hight="10%" srolling="no" frameborder="0" seamless>
      <iframe name="status" id="status" width="30%" hight="100%" src="status.php" scrolling="no" frameborder="0" seamless>
       <p>iframes are not supported by your browser.</p></iframe>
      <iframe  name="logo" id="logo" width="30%" hight="100%" src="header.php"  scrolling="no" frameborder="0" seamless>
       <p>iframes are not supported by your browser.</p></iframe>
 </iframe>
      <iframe name="bottom" id="bottom" width="100%" hight="90%" srolling="no" noresize="noresize" frameborder="0" seamless>
      <iframe name="menu" id="menu" width="20%" hight="100%" src="menu.php" scrolling="no" frameborder="0" seamless>
       <p>iframes are not supported by your browser.</p></iframe>
      <iframe  name="main" id="main" width="80%" hight="100%" src="login.php"  scrolling="no" frameborder="0" seamless>
       <p>iframes are not supported by your browser.</p></iframe>
 </iframe>


</body>
</html>

Open in new window


The output of the iframe is horrible were the header.php which is in the logo iframe is not appearing at the top edge of the screen but at the upper third, also the login.php is not shown in the fully but truncated,
Unfortunately using the other alternative (<div>) is not an option for as I am using for different pages different css (as some of them are ready to use to pages) and redesigning the css is a lot of work that is why I am thinking in the iframe), can some one help me please?
Ashraf HassaneinAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

GaryCommented:
You want the header frame to be on the top right?
Just change the width of the top frame to 68%

Change main frame to 100% width

...but you are still using an old fashioned way of making a site, you are going from frames to iframes which is just as bad.
Use iframes for small bits of code you may want to show, e.g. a news feed.  They shouldn't be used to design a site
Unfortunately using the other alternative (<div>) is not an option for as I am using for different pages different css
...then your design is flawed from the start.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Ray PaseurCommented:
Agree with GaryC123.  You should redesign the site.  Also, you may want to check the code meticulously.  Spelling errors are usually just ignored.  Example:  hight="10%" should probably be  height="10%" if it is to have any effect.
Ashraf HassaneinAuthor Commented:
Thanks for your support I am trying to redesign using the div.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.