Article Topic Learning Download Q&A Programming Dictionary Game Recent Updates

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

Home > Web Front-end > HTML Tutorial > body text

Layout problem split window into two_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 12:15:42

Original

1673 people have browsed it

Divide the browser window into upper and lower divs. The height of the upper div is 300px, and the remaining area is given to the lower div. Can it be done with css? I will only use js to first calculate the height of the external window, and then subtract the upper div. The height of the div is the height of the lower div.

Reply to discussion (solution)

This post was last edited by net_lover on 2012-10-14 15:27:45

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><style>html,body{height:100%;margin:0;padding:0;}</style></head><body><div id="top" style="height:80px;background:#f00; position:absolute; top:0; width:100%"></div><div id="main" style="height:100%;background:#000;margin-top:0!important; margin-top:-80px"></div></body></html>

Copy after login

Related labels：

布局问题将窗口一分为二

source：php.cn

Previous article：Help: About js problem_html/css_WEB-ITnose Next article：Question: Does deleting page links have any impact on SEO? _html/css_WEB-ITnose

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