HTML frame Attribute

Beginner
⏱️ 5 min read
📚 Updated: Jun 2026
🎯 3 Examples
Legacy Frames
HTML frame attribute tutorial — noresize on legacy frame elements in framesets
Overview

What You’ll Learn

In legacy HTML, the <frame> element inside a <frameset> could control whether users resize frame borders. That behavior is set with the noresize boolean attribute—not an attribute literally named frame. This tutorial covers that resize control for historical reference and maintenance of older pages.

01

Legacy frames

frameset context.

02

noresize

Fix frame size.

03

Default resize

Draggable borders.

04

Boolean attr

Presence = fixed.

05

noResize

JS property name.

06

Use iframe

Modern alternative.

Fundamentals

Purpose of frame Attribute

The topic of “frame resize control” in HTML framesets is about whether a user can resize a <frame> element by dragging its borders. By default, most browsers allowed resizing. Adding noresize to a frame fixes its size for layout consistency.

This is particularly relevant in the context of framesets, where HTML documents were divided into multiple frames displaying different content simultaneously. You might lock a navigation sidebar while keeping a main content frame resizable.

💡
Correct attribute name: noresize

There is no standard frame="noresize" syntax. Use <frame noresize> on the frame element. Omit noresize to allow resizing (the default).

⚠️
Obsolete in HTML5

<frameset> and <frame> are not used in modern HTML. Prefer CSS Grid/Flexbox for layout and <iframe> for embedded documents.

Foundation

📝 Syntax

Add the boolean noresize attribute to a <frame> inside a <frameset>:

frameset.html
<frameset cols="25%,75%">
  <frame src="nav.html" noresize>
  <frame src="main.html">
</frameset>

Syntax Rules

  • noresize is a boolean attribute on <frame> (legacy HTML4 framesets).
  • When present, the user cannot drag that frame’s border to resize it.
  • When absent, the frame is resizable (there is no resize attribute value).
  • Requires a frameset layout—not valid in HTML5 documents using <!DOCTYPE html>.
Reference

💎 Values

Resize behavior on <frame> elements is controlled by the presence or absence of noresize:

  • noresize (present) — The frame should not be resizable. Frame borders are fixed; users cannot drag to resize.
  • noresize (absent) — Default behavior. Users can resize the frame by dragging borders.

There is no separate resize attribute value. Resizable frames simply omit noresize.

frame-values.html
<!-- Fixed size (not resizable) -->
<frame src="sidebar.html" noresize>

<!-- Resizable (default) -->
<frame src="content.html">
Cheat Sheet

⚡ Quick Reference

ItemDetailsNotes
Correct attributenoresizeOn <frame>, not frame="..."
Fixed frameAdd noresizeUser cannot drag borders
Resizable frameOmit noresizeDefault behavior
Parent element<frameset>Obsolete in HTML5
JS propertyframeElement.noResizeBoolean
Modern alternative<iframe> + CSSUse for new projects
Scope

Applicable Elements

ElementSupported?Notes
<frame>Yes (legacy)Primary use of noresize
<iframe>Obsoletenoresize existed but is no longer recommended
<frameset>ContainerParent of frame elements
<div>, <form>NoNot frame elements
Compare

Legacy Frames vs Modern Layout

ApproachTechnologyStatus
Frameset + framenoresize, frameborderObsolete; learn for legacy code only
Page layoutCSS Grid, FlexboxRecommended for columns/rows
Embedded document<iframe>Recommended for external content
Hands-On

Examples Gallery

Three-column frameset with a fixed sidebar, resizable vs fixed comparison, and dynamic noResize in JavaScript. These examples use legacy HTML4 frameset syntax for educational purposes.

Implementation Example — Frameset with noresize

Let’s consider an example of how to use resize control within a frameset (corrected syntax):

index.html
<frameset cols="25%,50%,25%">
  <frame src="frame1.html" frameborder="1" scrolling="auto" noresize>
  <frame src="frame2.html" frameborder="1" scrolling="auto">
  <frame src="frame3.html" frameborder="1" scrolling="auto">
</frameset>
Try It Yourself

How It Works

The first frame includes noresize, so users cannot drag its border to change the 25% width. The second and third frames omit noresize, so they remain resizable by default.

Example — Fixed Sidebar vs Resizable Content

A typical pattern: lock the navigation column, allow the main area to resize:

sidebar-frameset.html
<frameset cols="200,*">
  <frame src="navigation.html" name="nav" noresize>
  <frame src="content.html" name="main">
</frameset>
Try It Yourself

How It Works

Using cols="200,*" sets a fixed pixel width for navigation. Adding noresize prevents users from changing that sidebar width, keeping the layout stable.

Dynamic Values with JavaScript

You can manipulate frame resize behavior dynamically using JavaScript on a frame element:

index.html
<frame src="panel.html" id="dynamicFrame">

<script>
  document.getElementById("dynamicFrame").noResize = true;
</script>
Try It Yourself

How It Works

Setting noResize = true on a frame element applies the same effect as the noresize HTML attribute, locking the frame border against user dragging.

A11y

♿ Accessibility

  • Framesets harm accessibility — Screen readers struggle with legacy frames; avoid them in new projects.
  • Prefer single-document layouts — CSS-based layouts are easier to navigate with keyboard and assistive tech.
  • If maintaining legacy frames — Provide meaningful title attributes on frames where supported.
  • Do not lock critical resize — Fixed frames can trap content; test zoom and small viewports.

🧠 How Frame Resize Control Works

1

Author builds a frameset

Multiple <frame> elements share the window.

Legacy
2

noresize locks a border

That frame cannot be dragged to resize.

Fixed
3

Other frames stay flexible

Without noresize, users adjust layout.

Resize
=

Controlled legacy layout

Historical pattern—use CSS for new work.

Compatibility

Browser Support

<frameset> and <frame> are obsolete in HTML5. Browsers may still render them for compatibility, but they should not be used in new projects.

⚠️ Legacy · Obsolete

Historical frameset support

Older browsers supported noresize on frame elements; modern HTML rejects framesets.

Legacy Not for new sites
frameset / noresize Obsolete in HTML5

Bottom line: Learn for legacy maintenance only. Build new layouts with CSS and <iframe>.

Pro Tips

💡 Best Practices

✅ Do

  • Use noresize (not frame="noresize") on frame elements
  • Lock sidebars when maintaining legacy framesets
  • Prefer CSS Grid/Flexbox for new layout work
  • Use <iframe> for embedding external pages
  • Test legacy framesets if you must maintain old sites

❌ Don’t

  • Build new sites with framesets
  • Use invalid frame="resize" syntax
  • Assume frames are accessible without extra work
  • Lock all frames—leave some flexibility unless required
  • Confuse <frame> with <iframe>
Wrap Up

Conclusion

Frame resize control in legacy HTML is handled by the noresize attribute on <frame> elements within framesets. By understanding its usage, you can maintain older frame-based layouts and recognize correct syntax when reviewing historical code.

For new projects, skip framesets entirely. Use modern CSS layout and iframes instead. See the frameborder attribute next for another legacy frame property.

View Examples Gallery Try frameset example
Summary

Key Takeaways

Knowledge Unlocked

Five truths every developer should know about frame resize control

Bookmark these when reading legacy HTML.

5
Core concepts
🗃 01

noresize

Correct attribute.

Syntax
🔒 02

Fixed border

No user drag.

Behavior
📐 03

Default resize

Omit noresize.

Default
⚙️ 04

noResize

JS property.

Script
🚀 05

Obsolete

Use CSS now.

Modern
🎯 You understand legacy frame resize behavior
Review Quick Reference →

❓ Frequently Asked Questions

There is no standard attribute named frame with resize values. Resize control uses the noresize boolean attribute on <frame> elements.
Add noresize to the <frame> element: <frame src="nav.html" noresize>.
No. Resizable frames are the default—simply omit noresize. There is no resize attribute value.
No. Framesets are obsolete in HTML5. Use CSS for layout and <iframe> for embedded documents.
Use frameElement.noResize = true or setAttribute("noresize", "").
<frame> was used inside obsolete <frameset> layouts. <iframe> embeds a document inside a normal HTML5 page and is still valid today.

Understand legacy frame layouts

Review corrected noresize syntax for historical framesets in the Try It editor.

Try frameset example →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

3 people found this page helpful

HTML formtarget Attribute HTML frameborder Attribute