Div Scroll not showing all contained text
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I have placed some random text into my .main
section of my website. The section has a fixed height of height: 100vh
and I have added a max-height: 100vh
with position: absolute and overflow: auto
. After testing the site, it scrolls down to the last few sentences then stops, cutting the other text contained. How would I change the code so the div .main
is able to be scrolled all the way through, showing all of the text.
You can see how the text is cut off at the bottom after full scroll.
/* == ~ Copyright (c) myEd (made by students, for students.) 2019. == */
html > body {
height: 100%;
overflow: hidden;
font-family: Helvetica, Arial, sans-serif;
margin: 0;
background: #444;
}
#wrapper {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden;
}
* {
box-sizing: border-box;
}
.navBar {
font-family: Helvetica, Arial, sans-serif;
background: #333;
overflow: hidden;
}
.navBar > a {
float: left;
font-size: 8px;
color: #FFF;
text-align: center;
padding: 12px 8px;
text-decoration: none;
display: block;
top: 0;
}
#productLogo {
float: right;
width: 8em;
margin-right: -10px;
}
.menuDropDown {
float: left;
overflow: hidden;
}
.menuDropDown > #menuButton {
font-size: 8px;
border: none;
outline: none;
color: #FFF;
padding: 12px 8px;
background: inherit;
font: inherit;
margin: 0;
}
#menuButton:hover, .navBar > a > .menuDropDown:hover > #menuButton {
background: #999;
color: #1B315E;
border: none;
outline: none;
}
.menuContent {
display: none;
position: absolute;
background: none;
width: 100%;
left: 0;
z-index: 1;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
max-height: 85vh;
overflow: auto;
}
.menuDropDown:hover > .menuContent {
display: block;
}
.menuColumn {
float: left;
width: 20%;
padding: 10px;
background-color: #999;
height: 235px;
overflow-y: auto;
}
#menuColumnHeader {
color: #1B315E;
}
.menuColumn > a {
float: none;
color: #1B315E;
padding: 12px;
text-decoration: none;
display: block;
text-align: left;
font-size: 14px;
}
.menuColumn > a:hover {
background-color: #A5A5A5;
}
.menuColumn > a.active {
background-color: #B6B6B6;
}
.menuRow: after {
content: "";
display: table;
clear: both;
}
.main {
width: 80%;
height: 100vh;
max-height: 100vh;
float: left;
background: none;
position: absolute;
overflow: auto;
}
.sideBar {
margin-left: 80%;
height: 100vh;
background: none;
overflow: hidden;
position: relative;
}
#news {
position: absolute;
width: 100%;
height: calc(100vh - 43px);
top: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.menuColumn {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 768px) {
.sideBar {
display: none !important;
}
.main {
width: 100%;
}
}
<!DOCTYPE HTML>
<!--
~ Copyright (c) myEd (made by students, for students.) 2019.
-->
<html lang="en-AU">
<head>
<title>Welcome | myEd</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/Resources/CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="shortcut icon" href="/Resources/Img/favicon.png">
</head>
<body>
<div id="wrapper">
<div class="navBar">
<img src="/Resources/Img/myEd.png" alt="myEd" title="myEd Software" id="productLogo">
<div class="menuDropDown">
<button id="menuButton" title="Whole Site Navigation"><i class="fas fa-bars"></i> Menu</button>
<div class="menuContent">
<div class="menuRow">
<div class="menuColumn">
<h5 id="menuColumnHeader" title="Home Workspace">Home Workspace</h5>
<a href="#" class="active" title="Welcome"><i class="fas fa-exclamation-circle"></i> Welcome</a>
<a href="#" title="Timetable"><i class="far fa-calendar-alt"></i> Timetable</a>
<a href="#" title="Help"><i class="fa fa-question-circle"></i> Help</a>
<a href="#" title="Dashboard"><i class="fas fa-chart-line"></i> Dashboard</a>
</div>
</div>
</div>
</div>
</div>
<div class="main">
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
</div>
<div class="sideBar">
<iframe id="news" frameborder="0" src="/Resources/News/index.html"></iframe>
</div>
</div>
</body>
</html>
Thanks,
Tom
html css
add a comment |
I have placed some random text into my .main
section of my website. The section has a fixed height of height: 100vh
and I have added a max-height: 100vh
with position: absolute and overflow: auto
. After testing the site, it scrolls down to the last few sentences then stops, cutting the other text contained. How would I change the code so the div .main
is able to be scrolled all the way through, showing all of the text.
You can see how the text is cut off at the bottom after full scroll.
/* == ~ Copyright (c) myEd (made by students, for students.) 2019. == */
html > body {
height: 100%;
overflow: hidden;
font-family: Helvetica, Arial, sans-serif;
margin: 0;
background: #444;
}
#wrapper {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden;
}
* {
box-sizing: border-box;
}
.navBar {
font-family: Helvetica, Arial, sans-serif;
background: #333;
overflow: hidden;
}
.navBar > a {
float: left;
font-size: 8px;
color: #FFF;
text-align: center;
padding: 12px 8px;
text-decoration: none;
display: block;
top: 0;
}
#productLogo {
float: right;
width: 8em;
margin-right: -10px;
}
.menuDropDown {
float: left;
overflow: hidden;
}
.menuDropDown > #menuButton {
font-size: 8px;
border: none;
outline: none;
color: #FFF;
padding: 12px 8px;
background: inherit;
font: inherit;
margin: 0;
}
#menuButton:hover, .navBar > a > .menuDropDown:hover > #menuButton {
background: #999;
color: #1B315E;
border: none;
outline: none;
}
.menuContent {
display: none;
position: absolute;
background: none;
width: 100%;
left: 0;
z-index: 1;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
max-height: 85vh;
overflow: auto;
}
.menuDropDown:hover > .menuContent {
display: block;
}
.menuColumn {
float: left;
width: 20%;
padding: 10px;
background-color: #999;
height: 235px;
overflow-y: auto;
}
#menuColumnHeader {
color: #1B315E;
}
.menuColumn > a {
float: none;
color: #1B315E;
padding: 12px;
text-decoration: none;
display: block;
text-align: left;
font-size: 14px;
}
.menuColumn > a:hover {
background-color: #A5A5A5;
}
.menuColumn > a.active {
background-color: #B6B6B6;
}
.menuRow: after {
content: "";
display: table;
clear: both;
}
.main {
width: 80%;
height: 100vh;
max-height: 100vh;
float: left;
background: none;
position: absolute;
overflow: auto;
}
.sideBar {
margin-left: 80%;
height: 100vh;
background: none;
overflow: hidden;
position: relative;
}
#news {
position: absolute;
width: 100%;
height: calc(100vh - 43px);
top: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.menuColumn {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 768px) {
.sideBar {
display: none !important;
}
.main {
width: 100%;
}
}
<!DOCTYPE HTML>
<!--
~ Copyright (c) myEd (made by students, for students.) 2019.
-->
<html lang="en-AU">
<head>
<title>Welcome | myEd</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/Resources/CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="shortcut icon" href="/Resources/Img/favicon.png">
</head>
<body>
<div id="wrapper">
<div class="navBar">
<img src="/Resources/Img/myEd.png" alt="myEd" title="myEd Software" id="productLogo">
<div class="menuDropDown">
<button id="menuButton" title="Whole Site Navigation"><i class="fas fa-bars"></i> Menu</button>
<div class="menuContent">
<div class="menuRow">
<div class="menuColumn">
<h5 id="menuColumnHeader" title="Home Workspace">Home Workspace</h5>
<a href="#" class="active" title="Welcome"><i class="fas fa-exclamation-circle"></i> Welcome</a>
<a href="#" title="Timetable"><i class="far fa-calendar-alt"></i> Timetable</a>
<a href="#" title="Help"><i class="fa fa-question-circle"></i> Help</a>
<a href="#" title="Dashboard"><i class="fas fa-chart-line"></i> Dashboard</a>
</div>
</div>
</div>
</div>
</div>
<div class="main">
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
</div>
<div class="sideBar">
<iframe id="news" frameborder="0" src="/Resources/News/index.html"></iframe>
</div>
</div>
</body>
</html>
Thanks,
Tom
html css
Well, the .main element is not located at the top of the window, but it's 100vh high. What did you expect?
– Mr Lister
Jan 4 at 7:57
Well do you have a solution @MrLister
– user10341225
Jan 4 at 8:00
What kind of solution are you after? Should the .main div be completely inside the viewport? Then work out what the height should be; that would be 100vh - the height of the navbar. Or turn the wrapper into a flexbox and dispense with the absolute positioning.
– Mr Lister
Jan 4 at 8:07
add a comment |
I have placed some random text into my .main
section of my website. The section has a fixed height of height: 100vh
and I have added a max-height: 100vh
with position: absolute and overflow: auto
. After testing the site, it scrolls down to the last few sentences then stops, cutting the other text contained. How would I change the code so the div .main
is able to be scrolled all the way through, showing all of the text.
You can see how the text is cut off at the bottom after full scroll.
/* == ~ Copyright (c) myEd (made by students, for students.) 2019. == */
html > body {
height: 100%;
overflow: hidden;
font-family: Helvetica, Arial, sans-serif;
margin: 0;
background: #444;
}
#wrapper {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden;
}
* {
box-sizing: border-box;
}
.navBar {
font-family: Helvetica, Arial, sans-serif;
background: #333;
overflow: hidden;
}
.navBar > a {
float: left;
font-size: 8px;
color: #FFF;
text-align: center;
padding: 12px 8px;
text-decoration: none;
display: block;
top: 0;
}
#productLogo {
float: right;
width: 8em;
margin-right: -10px;
}
.menuDropDown {
float: left;
overflow: hidden;
}
.menuDropDown > #menuButton {
font-size: 8px;
border: none;
outline: none;
color: #FFF;
padding: 12px 8px;
background: inherit;
font: inherit;
margin: 0;
}
#menuButton:hover, .navBar > a > .menuDropDown:hover > #menuButton {
background: #999;
color: #1B315E;
border: none;
outline: none;
}
.menuContent {
display: none;
position: absolute;
background: none;
width: 100%;
left: 0;
z-index: 1;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
max-height: 85vh;
overflow: auto;
}
.menuDropDown:hover > .menuContent {
display: block;
}
.menuColumn {
float: left;
width: 20%;
padding: 10px;
background-color: #999;
height: 235px;
overflow-y: auto;
}
#menuColumnHeader {
color: #1B315E;
}
.menuColumn > a {
float: none;
color: #1B315E;
padding: 12px;
text-decoration: none;
display: block;
text-align: left;
font-size: 14px;
}
.menuColumn > a:hover {
background-color: #A5A5A5;
}
.menuColumn > a.active {
background-color: #B6B6B6;
}
.menuRow: after {
content: "";
display: table;
clear: both;
}
.main {
width: 80%;
height: 100vh;
max-height: 100vh;
float: left;
background: none;
position: absolute;
overflow: auto;
}
.sideBar {
margin-left: 80%;
height: 100vh;
background: none;
overflow: hidden;
position: relative;
}
#news {
position: absolute;
width: 100%;
height: calc(100vh - 43px);
top: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.menuColumn {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 768px) {
.sideBar {
display: none !important;
}
.main {
width: 100%;
}
}
<!DOCTYPE HTML>
<!--
~ Copyright (c) myEd (made by students, for students.) 2019.
-->
<html lang="en-AU">
<head>
<title>Welcome | myEd</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/Resources/CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="shortcut icon" href="/Resources/Img/favicon.png">
</head>
<body>
<div id="wrapper">
<div class="navBar">
<img src="/Resources/Img/myEd.png" alt="myEd" title="myEd Software" id="productLogo">
<div class="menuDropDown">
<button id="menuButton" title="Whole Site Navigation"><i class="fas fa-bars"></i> Menu</button>
<div class="menuContent">
<div class="menuRow">
<div class="menuColumn">
<h5 id="menuColumnHeader" title="Home Workspace">Home Workspace</h5>
<a href="#" class="active" title="Welcome"><i class="fas fa-exclamation-circle"></i> Welcome</a>
<a href="#" title="Timetable"><i class="far fa-calendar-alt"></i> Timetable</a>
<a href="#" title="Help"><i class="fa fa-question-circle"></i> Help</a>
<a href="#" title="Dashboard"><i class="fas fa-chart-line"></i> Dashboard</a>
</div>
</div>
</div>
</div>
</div>
<div class="main">
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
</div>
<div class="sideBar">
<iframe id="news" frameborder="0" src="/Resources/News/index.html"></iframe>
</div>
</div>
</body>
</html>
Thanks,
Tom
html css
I have placed some random text into my .main
section of my website. The section has a fixed height of height: 100vh
and I have added a max-height: 100vh
with position: absolute and overflow: auto
. After testing the site, it scrolls down to the last few sentences then stops, cutting the other text contained. How would I change the code so the div .main
is able to be scrolled all the way through, showing all of the text.
You can see how the text is cut off at the bottom after full scroll.
/* == ~ Copyright (c) myEd (made by students, for students.) 2019. == */
html > body {
height: 100%;
overflow: hidden;
font-family: Helvetica, Arial, sans-serif;
margin: 0;
background: #444;
}
#wrapper {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden;
}
* {
box-sizing: border-box;
}
.navBar {
font-family: Helvetica, Arial, sans-serif;
background: #333;
overflow: hidden;
}
.navBar > a {
float: left;
font-size: 8px;
color: #FFF;
text-align: center;
padding: 12px 8px;
text-decoration: none;
display: block;
top: 0;
}
#productLogo {
float: right;
width: 8em;
margin-right: -10px;
}
.menuDropDown {
float: left;
overflow: hidden;
}
.menuDropDown > #menuButton {
font-size: 8px;
border: none;
outline: none;
color: #FFF;
padding: 12px 8px;
background: inherit;
font: inherit;
margin: 0;
}
#menuButton:hover, .navBar > a > .menuDropDown:hover > #menuButton {
background: #999;
color: #1B315E;
border: none;
outline: none;
}
.menuContent {
display: none;
position: absolute;
background: none;
width: 100%;
left: 0;
z-index: 1;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
max-height: 85vh;
overflow: auto;
}
.menuDropDown:hover > .menuContent {
display: block;
}
.menuColumn {
float: left;
width: 20%;
padding: 10px;
background-color: #999;
height: 235px;
overflow-y: auto;
}
#menuColumnHeader {
color: #1B315E;
}
.menuColumn > a {
float: none;
color: #1B315E;
padding: 12px;
text-decoration: none;
display: block;
text-align: left;
font-size: 14px;
}
.menuColumn > a:hover {
background-color: #A5A5A5;
}
.menuColumn > a.active {
background-color: #B6B6B6;
}
.menuRow: after {
content: "";
display: table;
clear: both;
}
.main {
width: 80%;
height: 100vh;
max-height: 100vh;
float: left;
background: none;
position: absolute;
overflow: auto;
}
.sideBar {
margin-left: 80%;
height: 100vh;
background: none;
overflow: hidden;
position: relative;
}
#news {
position: absolute;
width: 100%;
height: calc(100vh - 43px);
top: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.menuColumn {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 768px) {
.sideBar {
display: none !important;
}
.main {
width: 100%;
}
}
<!DOCTYPE HTML>
<!--
~ Copyright (c) myEd (made by students, for students.) 2019.
-->
<html lang="en-AU">
<head>
<title>Welcome | myEd</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/Resources/CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="shortcut icon" href="/Resources/Img/favicon.png">
</head>
<body>
<div id="wrapper">
<div class="navBar">
<img src="/Resources/Img/myEd.png" alt="myEd" title="myEd Software" id="productLogo">
<div class="menuDropDown">
<button id="menuButton" title="Whole Site Navigation"><i class="fas fa-bars"></i> Menu</button>
<div class="menuContent">
<div class="menuRow">
<div class="menuColumn">
<h5 id="menuColumnHeader" title="Home Workspace">Home Workspace</h5>
<a href="#" class="active" title="Welcome"><i class="fas fa-exclamation-circle"></i> Welcome</a>
<a href="#" title="Timetable"><i class="far fa-calendar-alt"></i> Timetable</a>
<a href="#" title="Help"><i class="fa fa-question-circle"></i> Help</a>
<a href="#" title="Dashboard"><i class="fas fa-chart-line"></i> Dashboard</a>
</div>
</div>
</div>
</div>
</div>
<div class="main">
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
</div>
<div class="sideBar">
<iframe id="news" frameborder="0" src="/Resources/News/index.html"></iframe>
</div>
</div>
</body>
</html>
Thanks,
Tom
/* == ~ Copyright (c) myEd (made by students, for students.) 2019. == */
html > body {
height: 100%;
overflow: hidden;
font-family: Helvetica, Arial, sans-serif;
margin: 0;
background: #444;
}
#wrapper {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden;
}
* {
box-sizing: border-box;
}
.navBar {
font-family: Helvetica, Arial, sans-serif;
background: #333;
overflow: hidden;
}
.navBar > a {
float: left;
font-size: 8px;
color: #FFF;
text-align: center;
padding: 12px 8px;
text-decoration: none;
display: block;
top: 0;
}
#productLogo {
float: right;
width: 8em;
margin-right: -10px;
}
.menuDropDown {
float: left;
overflow: hidden;
}
.menuDropDown > #menuButton {
font-size: 8px;
border: none;
outline: none;
color: #FFF;
padding: 12px 8px;
background: inherit;
font: inherit;
margin: 0;
}
#menuButton:hover, .navBar > a > .menuDropDown:hover > #menuButton {
background: #999;
color: #1B315E;
border: none;
outline: none;
}
.menuContent {
display: none;
position: absolute;
background: none;
width: 100%;
left: 0;
z-index: 1;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
max-height: 85vh;
overflow: auto;
}
.menuDropDown:hover > .menuContent {
display: block;
}
.menuColumn {
float: left;
width: 20%;
padding: 10px;
background-color: #999;
height: 235px;
overflow-y: auto;
}
#menuColumnHeader {
color: #1B315E;
}
.menuColumn > a {
float: none;
color: #1B315E;
padding: 12px;
text-decoration: none;
display: block;
text-align: left;
font-size: 14px;
}
.menuColumn > a:hover {
background-color: #A5A5A5;
}
.menuColumn > a.active {
background-color: #B6B6B6;
}
.menuRow: after {
content: "";
display: table;
clear: both;
}
.main {
width: 80%;
height: 100vh;
max-height: 100vh;
float: left;
background: none;
position: absolute;
overflow: auto;
}
.sideBar {
margin-left: 80%;
height: 100vh;
background: none;
overflow: hidden;
position: relative;
}
#news {
position: absolute;
width: 100%;
height: calc(100vh - 43px);
top: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.menuColumn {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 768px) {
.sideBar {
display: none !important;
}
.main {
width: 100%;
}
}
<!DOCTYPE HTML>
<!--
~ Copyright (c) myEd (made by students, for students.) 2019.
-->
<html lang="en-AU">
<head>
<title>Welcome | myEd</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/Resources/CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="shortcut icon" href="/Resources/Img/favicon.png">
</head>
<body>
<div id="wrapper">
<div class="navBar">
<img src="/Resources/Img/myEd.png" alt="myEd" title="myEd Software" id="productLogo">
<div class="menuDropDown">
<button id="menuButton" title="Whole Site Navigation"><i class="fas fa-bars"></i> Menu</button>
<div class="menuContent">
<div class="menuRow">
<div class="menuColumn">
<h5 id="menuColumnHeader" title="Home Workspace">Home Workspace</h5>
<a href="#" class="active" title="Welcome"><i class="fas fa-exclamation-circle"></i> Welcome</a>
<a href="#" title="Timetable"><i class="far fa-calendar-alt"></i> Timetable</a>
<a href="#" title="Help"><i class="fa fa-question-circle"></i> Help</a>
<a href="#" title="Dashboard"><i class="fas fa-chart-line"></i> Dashboard</a>
</div>
</div>
</div>
</div>
</div>
<div class="main">
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
</div>
<div class="sideBar">
<iframe id="news" frameborder="0" src="/Resources/News/index.html"></iframe>
</div>
</div>
</body>
</html>
/* == ~ Copyright (c) myEd (made by students, for students.) 2019. == */
html > body {
height: 100%;
overflow: hidden;
font-family: Helvetica, Arial, sans-serif;
margin: 0;
background: #444;
}
#wrapper {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: absolute;
overflow: hidden;
}
* {
box-sizing: border-box;
}
.navBar {
font-family: Helvetica, Arial, sans-serif;
background: #333;
overflow: hidden;
}
.navBar > a {
float: left;
font-size: 8px;
color: #FFF;
text-align: center;
padding: 12px 8px;
text-decoration: none;
display: block;
top: 0;
}
#productLogo {
float: right;
width: 8em;
margin-right: -10px;
}
.menuDropDown {
float: left;
overflow: hidden;
}
.menuDropDown > #menuButton {
font-size: 8px;
border: none;
outline: none;
color: #FFF;
padding: 12px 8px;
background: inherit;
font: inherit;
margin: 0;
}
#menuButton:hover, .navBar > a > .menuDropDown:hover > #menuButton {
background: #999;
color: #1B315E;
border: none;
outline: none;
}
.menuContent {
display: none;
position: absolute;
background: none;
width: 100%;
left: 0;
z-index: 1;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
max-height: 85vh;
overflow: auto;
}
.menuDropDown:hover > .menuContent {
display: block;
}
.menuColumn {
float: left;
width: 20%;
padding: 10px;
background-color: #999;
height: 235px;
overflow-y: auto;
}
#menuColumnHeader {
color: #1B315E;
}
.menuColumn > a {
float: none;
color: #1B315E;
padding: 12px;
text-decoration: none;
display: block;
text-align: left;
font-size: 14px;
}
.menuColumn > a:hover {
background-color: #A5A5A5;
}
.menuColumn > a.active {
background-color: #B6B6B6;
}
.menuRow: after {
content: "";
display: table;
clear: both;
}
.main {
width: 80%;
height: 100vh;
max-height: 100vh;
float: left;
background: none;
position: absolute;
overflow: auto;
}
.sideBar {
margin-left: 80%;
height: 100vh;
background: none;
overflow: hidden;
position: relative;
}
#news {
position: absolute;
width: 100%;
height: calc(100vh - 43px);
top: 0;
left: 0;
}
@media screen and (max-width: 600px) {
.menuColumn {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 768px) {
.sideBar {
display: none !important;
}
.main {
width: 100%;
}
}
<!DOCTYPE HTML>
<!--
~ Copyright (c) myEd (made by students, for students.) 2019.
-->
<html lang="en-AU">
<head>
<title>Welcome | myEd</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/Resources/CSS/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="shortcut icon" href="/Resources/Img/favicon.png">
</head>
<body>
<div id="wrapper">
<div class="navBar">
<img src="/Resources/Img/myEd.png" alt="myEd" title="myEd Software" id="productLogo">
<div class="menuDropDown">
<button id="menuButton" title="Whole Site Navigation"><i class="fas fa-bars"></i> Menu</button>
<div class="menuContent">
<div class="menuRow">
<div class="menuColumn">
<h5 id="menuColumnHeader" title="Home Workspace">Home Workspace</h5>
<a href="#" class="active" title="Welcome"><i class="fas fa-exclamation-circle"></i> Welcome</a>
<a href="#" title="Timetable"><i class="far fa-calendar-alt"></i> Timetable</a>
<a href="#" title="Help"><i class="fa fa-question-circle"></i> Help</a>
<a href="#" title="Dashboard"><i class="fas fa-chart-line"></i> Dashboard</a>
</div>
</div>
</div>
</div>
</div>
<div class="main">
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
Up unpacked friendly ecstatic so possible humoured do. Ample end might folly quiet one set spoke her. We no am former valley assure. Four need spot ye said we find mile. Are commanded him convinced dashwoods did estimable forfeited. Shy celebrated met sentiments she reasonably but. Proposal its disposed eat advanced marriage sociable. Drawings led greatest add subjects endeavor gay remember. Principles one yet assistance you met impossible.
Piqued favour stairs it enable exeter as seeing. Remainder met improving but engrossed sincerity age. Better but length gay denied abroad are. Attachment astonished to on appearance imprudence so collecting in excellence. Tiled way blind lived whose new. The for fully had she there leave merit enjoy forth.
Ferrars all spirits his imagine effects amongst neither. It bachelor cheerful of mistaken. Tore has sons put upon wife use bred seen. Its dissimilar invitation ten has discretion unreserved. Had you him humoured jointure ask expenses learning. Blush on in jokes sense do do. Brother hundred he assured reached on up no. On am nearer missed lovers. To it mother extent temper figure better.
Living valley had silent eat merits esteem bed. In last an or went wise as left. Visited civilly am demesne so colonel he calling. So unreserved do interested increasing sentiments. Vanity day giving points within six not law. Few impression difficulty his use has comparison decisively.
When be draw drew ye. Defective in do recommend suffering. House it seven in spoil tiled court. Sister others marked fat missed did out use. Alteration possession dispatched collecting instrument travelling he or on. Snug give made at spot or late that mr.
Attention he extremity unwilling on otherwise. Conviction up partiality as delightful is discovered. Yet jennings resolved disposed exertion you off. Left did fond drew fat head poor. So if he into shot half many long. China fully him every fat was world grave.
Started several mistake joy say painful removed reached end. State burst think end are its. Arrived off she elderly beloved him affixed noisier yet. An course regard to up he hardly. View four has said does men saw find dear shy. Talent men wicket add garden.
Civility vicinity graceful is it at. Improve up at to on mention perhaps raising. Way building not get formerly her peculiar. Up uncommonly prosperous sentiments simplicity acceptance to so. Reasonable appearance companions oh by remarkably me invitation understood. Pursuit elderly ask perhaps all.
May musical arrival beloved luckily adapted him. Shyness mention married son she his started now. Rose if as past near were. To graceful he elegance oh moderate attended entrance pleasure. Vulgar saw fat sudden edward way played either. Thoughts smallest at or peculiar relation breeding produced an. At depart spirit on stairs. She the either are wisdom praise things she before. Be mother itself vanity favour do me of. Begin sex was power joy after had walls miles.
Of on affixed civilly moments promise explain fertile in. Assurance advantage belonging happiness departure so of. Now improving and one sincerity intention allowance commanded not. Oh an am frankness be necessary earnestly advantage estimable extensive. Five he wife gone ye. Mrs suffering sportsmen earnestly any. In am do giving to afford parish settle easily garret.
</div>
<div class="sideBar">
<iframe id="news" frameborder="0" src="/Resources/News/index.html"></iframe>
</div>
</div>
</body>
</html>
html css
html css
asked Jan 4 at 7:45
user10341225user10341225
456
456
Well, the .main element is not located at the top of the window, but it's 100vh high. What did you expect?
– Mr Lister
Jan 4 at 7:57
Well do you have a solution @MrLister
– user10341225
Jan 4 at 8:00
What kind of solution are you after? Should the .main div be completely inside the viewport? Then work out what the height should be; that would be 100vh - the height of the navbar. Or turn the wrapper into a flexbox and dispense with the absolute positioning.
– Mr Lister
Jan 4 at 8:07
add a comment |
Well, the .main element is not located at the top of the window, but it's 100vh high. What did you expect?
– Mr Lister
Jan 4 at 7:57
Well do you have a solution @MrLister
– user10341225
Jan 4 at 8:00
What kind of solution are you after? Should the .main div be completely inside the viewport? Then work out what the height should be; that would be 100vh - the height of the navbar. Or turn the wrapper into a flexbox and dispense with the absolute positioning.
– Mr Lister
Jan 4 at 8:07
Well, the .main element is not located at the top of the window, but it's 100vh high. What did you expect?
– Mr Lister
Jan 4 at 7:57
Well, the .main element is not located at the top of the window, but it's 100vh high. What did you expect?
– Mr Lister
Jan 4 at 7:57
Well do you have a solution @MrLister
– user10341225
Jan 4 at 8:00
Well do you have a solution @MrLister
– user10341225
Jan 4 at 8:00
What kind of solution are you after? Should the .main div be completely inside the viewport? Then work out what the height should be; that would be 100vh - the height of the navbar. Or turn the wrapper into a flexbox and dispense with the absolute positioning.
– Mr Lister
Jan 4 at 8:07
What kind of solution are you after? Should the .main div be completely inside the viewport? Then work out what the height should be; that would be 100vh - the height of the navbar. Or turn the wrapper into a flexbox and dispense with the absolute positioning.
– Mr Lister
Jan 4 at 8:07
add a comment |
2 Answers
2
active
oldest
votes
.main
height should be
height: calc(100vh - 100px); /* change 100px with the height of your header*/
add a comment |
The problem is within the parent of your html/css code. 'wrapper' has a 'overflow' css attribute, thats why you are missing sentences, because it is hidden. So to fix the code you need to remove the overflow from the 'wrapper' and also remove the overflow from the 'main'.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54034895%2fdiv-scroll-not-showing-all-contained-text%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
.main
height should be
height: calc(100vh - 100px); /* change 100px with the height of your header*/
add a comment |
.main
height should be
height: calc(100vh - 100px); /* change 100px with the height of your header*/
add a comment |
.main
height should be
height: calc(100vh - 100px); /* change 100px with the height of your header*/
.main
height should be
height: calc(100vh - 100px); /* change 100px with the height of your header*/
answered Jan 4 at 8:06
kiranvjkiranvj
13.1k23653
13.1k23653
add a comment |
add a comment |
The problem is within the parent of your html/css code. 'wrapper' has a 'overflow' css attribute, thats why you are missing sentences, because it is hidden. So to fix the code you need to remove the overflow from the 'wrapper' and also remove the overflow from the 'main'.
add a comment |
The problem is within the parent of your html/css code. 'wrapper' has a 'overflow' css attribute, thats why you are missing sentences, because it is hidden. So to fix the code you need to remove the overflow from the 'wrapper' and also remove the overflow from the 'main'.
add a comment |
The problem is within the parent of your html/css code. 'wrapper' has a 'overflow' css attribute, thats why you are missing sentences, because it is hidden. So to fix the code you need to remove the overflow from the 'wrapper' and also remove the overflow from the 'main'.
The problem is within the parent of your html/css code. 'wrapper' has a 'overflow' css attribute, thats why you are missing sentences, because it is hidden. So to fix the code you need to remove the overflow from the 'wrapper' and also remove the overflow from the 'main'.
answered Jan 4 at 8:16
JaapaapJaapaap
1865
1865
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54034895%2fdiv-scroll-not-showing-all-contained-text%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Well, the .main element is not located at the top of the window, but it's 100vh high. What did you expect?
– Mr Lister
Jan 4 at 7:57
Well do you have a solution @MrLister
– user10341225
Jan 4 at 8:00
What kind of solution are you after? Should the .main div be completely inside the viewport? Then work out what the height should be; that would be 100vh - the height of the navbar. Or turn the wrapper into a flexbox and dispense with the absolute positioning.
– Mr Lister
Jan 4 at 8:07