HTML Tutorial


 Forum HomeForum Home   FAQFAQ   SearchSearch   MemberlistMemberlist   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 
RegisterRegister - Not registered yet? Got something to say? Join HTML Code Tutorial!
Help with the layout
Post new topic   Reply to topic    HTML Help Forum Index -> HTML Frame
View previous topic :: View next topic  
Author Message
julienko3



Joined: 26 Aug 2005
Posts: 1

PostPosted: Fri Aug 26, 2005 5:51 am     Help with the layout Reply with quote

Hey guys, my name is Julien and I'm 11 yrs old. I'm sorta new to the HTML language.

I really need help with the layout of frames. The few times I got my frames to line up where I wanted them to, I got very very lucky.
I have everything down fine but I just don't understand how to get the frames where I want them to be. I dont really understand the "ROWS"
and "COLS" tags either. If someone could please help me pretending like I don't know about frames at all, because I just need a total re- explanation, that would be great.

Thanks-Julien :)
gary.newelluk



Joined: 12 May 2005
Posts: 548
Location: Peterhead, Scotland

PostPosted: Sat Aug 27, 2005 10:29 am     Reply with quote

Welcome Julien....

You can read my tutorial on frames to see if it makes things any clearer at http://www.newellwebservices.co.uk/frames.html.

Otherwise read on........

Ok say you want 3 frames, a left column, a center column and a right column.

First of all you need to create an outer frameset using:

Code:

<frameset cols="33%,33%,34%">
</frameset>


Note the cols= bit. The 3 values inside determine the width of each frame and can be expressed as a percentage of the width of the screen or in pixel widths.

In the example above the frames are 33%, 33% and 34%.

You can also use the wildcard * to specify the rest of the screen as follows:

Code:

<frameset cols="33%,33%,*">
</frameset>


The * basically means whatever is left of the screen use up. You can place the * in any of the positions as follows:

Code:

<frameset cols="33%,*,34%">
</frameset>


In the above example the first frame would be 33% from the left, the last frame would be 34% from the right and the middle would be whatevers left.

Ok moving on....

To specify the contents of each frame the <frame src=""> tag is used as follows:

Code:

<frameset cols="33%,*,34%">
   <frame src="http://www.newellwebservices.co.uk">
   <frame src="http://www.newellwebservices.co.uk">
   <frame src="http://www.newellwebservices.co.uk">
</frameset>


You need one <frame> tag for each attribute in the <frameset> tag so in the example above 3. (33%,33%,34%).

The src="" bit points to the webpage you want to display in the frame.

It maybe that instead of columns across the page you want rows down the page and instead of using the cols attribute for <frameset> you use the rows attribute as follows:

Code:

<frameset rows="33%,*,34%">
   <frame src="http://www.newellwebservices.co.uk">
   <frame src="http://www.newellwebservices.co.uk">
   <frame src="http://www.newellwebservices.co.uk">
</frameset>


In the above example there would be 3 rows going down the page. The percentages bit works the same as do the number of <frame> tags.

More than likely however you will want to mix columns and frames together and you can do this by nesting them.

To get a header, 3 columns and a footer add the following code:

Code:

<frameset rows="10%,*,10%">
   <frame src="http://www.newellwebservices.co.uk">
   <frameset cols="20%,*,20%">
      <frame src="http://www.newellwebservices.co.uk">
      <frame src="http://www.newellwebservices.co.uk">
      <frame src="http://www.newellwebservices.co.uk">
   </frameset>
   <frame src="http://www.newellwebservices.co.uk">
</frameset>


Now if you run the code above it looks ugly because my site has not been designed to be displayed this way.

Basically the first <frameset> tag denotes 3 rows. 1 as 10% of the screen at the top, 1 as 10% of the screen at the bottom and the rest in the middle.

Inside these frameset tags I have created a <frame> tag which you would use to point to header.html. You can just specify an image name if you want.

After the first <frame> tag you specify another <frameset> tag. This specifies that the middle row is going to have 3 columns. The left column is 20%, the right column is 20% and the middle is whatever is left (60%) by my reckoning).

Inside the 2nd set of <frameset> tags are the three <frame> tags which all point to my site but you would point them to left.html,content.html and right.html.

Finally after the closure of the inner <frameset> tag the is the final <frame> tag which you would use to point to footer.html (a copyright type message).

Thats it.... frames in 20 seconds.

After all this I would say 1 thing.... don't use frames they are ugly and don't work for every browser.
Display posts from previous:   
Post new topic   Reply to topic    HTML Help Forum Index -> HTML Frame All times are GMT - 8 Hours
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
HTML Help Archive
Powered by phpBB © 2001, 2005 phpBB Group
HTML Help topic RSS feed 

 
HOSTING / DESIGN
MAKE MONEY

Home
  |   Tutorials   |   Forum   |   Quick List   |   Link Directory   |   About
Copyright ©1997-2002 Idocs and ©2002-2007 HTML Code Tutorial