
- CSS Tutorial
- CSS - Home
- CSS - Introduction
- CSS - Syntax
- CSS - Inclusion
- CSS - Measurement Units
- CSS - Colors
- CSS - Backgrounds
- CSS - Fonts
- CSS - Text
- CSS - Images
- CSS - Links
- CSS - Tables
- CSS - Borders
- CSS - Margins
- CSS - Lists
- CSS - Padding
- CSS - Cursors
- CSS - Outlines
- CSS - Dimension
- CSS - Scrollbars
- CSS Advanced
- CSS - Visibility
- CSS - Positioning
- CSS - Layers
- CSS - Pseudo Classes
- CSS - Pseudo Elements
- CSS - @ Rules
- CSS - Text Effects
- CSS - Media Types
- CSS - Paged Media
- CSS - Aural Media
- CSS - Printing
- CSS - Layouts
- CSS - Validations
- CSS3 Tutorial
- CSS3 - Tutorial
- CSS3 - Rounded Corner
- CSS3 - Border Images
- CSS3 - Multi Background
- CSS3 - Color
- CSS3 - Gradients
- CSS3 - Shadow
- CSS3 - Text
- CSS3 - Web font
- CSS3 - 2d transform
- CSS3 - 3d transform
- CSS3 - Animation
- CSS3 - Multi columns
- CSS3 - User Interface
- CSS3 - Box Sizing
- CSS Responsive
- CSS - Responsive Web Design
- CSS References
- CSS - Questions and Answers
- CSS - Quick Guide
- CSS - References
- CSS - Color References
- CSS - Web browser References
- CSS - Web safe fonts
- CSS - Units
- CSS - Animation
- CSS Resources
- CSS - Useful Resources
- CSS - Discussion
How to stretch elements to fit the whole height of the browser window with CSS?
To stretch elements to fit the whole height of the browser window with CSS, the code is as follows −
Example
<!DOCTYPE html> <html> <head> <title>Page Title</title> <style> *{ box-sizing: border-box; } html, body { height: 100%; margin: 0; } .fullHeight{ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; height: 100%; background: rgb(135, 27, 207); color:white; font-size: 40px; padding: 40px; } </style> </head> <body> <div class="fullHeight">This div element will stretch to the whole height and width of the window</div> </body> </html>
Output
The above code will produce the following output −
- Related Articles
- How to close the whole browser window by keeping the webDriver active?
- How to create a browser window example with CSS?
- How to find the inner height and inner width of a browser window in JavaScript?
- How to make the web page height to fit screen height with HTML?
- How to Make a DIV 100% of the Window Height using CSS
- How to set the size of the browser window in Selenium?
- How to avoid the pop-up window in chrome browser with Selenium?
- HTML5 Canvas fit to window
- Set the font stretch of an element with CSS
- How to Resize Browser Window in WebDriver?
- How to adjust the width and height of an iframe to fit with content in it HTML?
- How to maximize the browser window in Selenium WebDriver using C#?
- How to specify the bottom position of 3D elements with CSS
- How to delete a localStorage item when the browser window/tab is closed?
- How to open a browser window in full screen using Selenium WebDriver with C#?

Advertisements