Created
November 1, 2018 12:58
-
-
Save melvinstanly/739eb6d73d3502c1b0c0aae20f1f73b8 to your computer and use it in GitHub Desktop.
Common CSS issues
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
// Content jumping when scroll bar is introduced | |
<div class="outer-wrapper"> | |
<div class="inner-wrapper"> | |
<div> | |
// Contents that affects overflow here | |
</div> | |
</div> | |
</div> | |
//Set the desired height to the outer wrapper and the desired width to the inner one. | |
//Display the outer wrapper as an inline-block, in order to make it shrink to the size of its content. | |
//Hide the overflow on the outer wrapper. Use overflow-y: auto | |
#outer-wrapper { | |
height: 150px; | |
overflow: hidden; | |
display: inline-block; | |
overflow-y:auto | |
} | |
#inner-wrapperv { | |
width: 200px; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment