Home > Web Front-end > HTML Tutorial > How to position DIV relative to the top-level frame? _html/css_WEB-ITnose

How to position DIV relative to the top-level frame? _html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:17:14
Original
1279 people have browsed it

There is such a page, which contains three frames:





There is a div in frame3 , how can we position the div absolutely relative to the frameset with name="test" instead of relative to frame3?


Reply to discussion (solution)

frameset position:relative
frame3 position:static
div position:absolute

Absolutely positioned elements Position is relative to the nearest positioned ancestor, or, if the element has no positioned ancestor, its position is relative to the original containing block.

Reference:
http://w3school.com.cn/css/css_positioning_absolute.asp
http://w3school.com.cn/css/pr_class_position.asp

After testing, the method on Floor #1 does not work. The positioning attribute is generally only relative to the current window, and in the frame, each frame corresponds to a window.

It seems that FRAMESET is no longer used and many browsers do not support it. It is recommended to replace it with Iframe

Frameset does not work and cannot cross frames.

According to the modification of #3, the three layouts are implemented with iframes, and then the divs are placed on the parent page, so that they can be positioned relative to each other.

After testing, the method on the 1st floor works. Doesn’t make sense. The positioning attribute is generally only relative to the current window, and in the frame, each frame corresponds to a window.
Oh, sorry for posting without testing, just kidding = =

It seems that FRAMESET is no longer used, many browsers do not support it, it is recommended to replace it with Iframe
How many years is this There is nothing I can do about the previous project. It is being modified now, but the framework cannot be moved. I also understand the solution you mentioned, thank you!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template