19

Create the div height 100%, but the page scroll bar should not appear

 4 years ago
source link: https://www.codesd.com/item/create-the-div-height-100-but-the-page-scroll-bar-should-not-appear.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

Create the div height 100%, but the page scroll bar should not appear

advertisements

I am create a div with 100% height HTML

<div id="BottomShelf"></div>

#BottomShelf{ position:absolute; top:400px; left:0px; width:100%; height:100%;; background:#d4b7a0; z-index:1;}

There is a page scroll showing up on the page, but I need a page scroll (not div scroll) only when there is content. height:auto does not do the trick too.

I need the div to take the browser height irrespective to the height of the monitor.


try to set top: 400px; bottom: 0; instead of top: 400px; height: 100%;

EDIT: note that this might not work in IE6 (don't know about IE7)

Tags css

Related Articles

The disguised scroll bar does not appear on Internet Explorer

I just created a customized scroll bar in CSS, in Google Chrome the scroll bar displays well and with the style I created for it, but in Internet explorer doesn't seem to be appearing at all... It's appearing the default scroll bar. How can I make th

Google Maps The zoom scroll bar does not appear on a new version

I have a web-page here. It uses google maps and it worked well. Recently a new version of google maps was released where some changes were made. For instance, instead of e.latLng.F, e.latLng.lng and instead of e.latLng.A, e.latLng.lat should be used.

The vertical scroll bar does not appear in div

I'm trying to create a layout that looks like this: The nav and content panes should have independent vertical scrollbars. I managed to get most of it working. But the "nav" div is not showing the scrollbar, even if overflow is set to scroll. Ho

The page scroll bar hangs while div is updated by Ajax responseText

I'm using jQuery's $.ajax() to send Ajax request to server and bring back a large chunk of HTML content to replace the content of a div. Everything works fine except for the problem that while the div is being updated, the page is kind of frozen (eve

The horizontal scroll bar is not visible on DataGridView

I have a DataGridView on Window form which is populated with 30 columns and thousands of rows. ScrollBars property is set to Both, but still horizontal scroll bar is not visible. even I am unable to scroll with arrow key from keyboard. I tried it by

The Android action bar does not appear

I am not sure why the action bar does not appear on my main menu, i already cleaned my project but it still doesn't work. the main xml <menu xmlns:android="http://schemas.android.com/apk/res/android" > <item android:id="@+id/action

The scroll bar does not appear in the Web page

Im helping a friend with a website and when i resize the browser windows the scroll bar on the right side is not showing up. Is there a fix for this or a way to work around it? here is the site page im working on FixedYour whole web-page is wrapped i

Why the scroll bar does not appear in a DIV

I have the following HTML code (please disregard the inline style, still testing and eventually move to external file): <div style="width: 80%; margin: 0 auto; border: 1px solid #A7DFFF; background: #DDDDDD; height: 350px;"> <div style=

How to get rid of the horizontal scroll bar when not needed

I have jqGrid with two columns, one being hidden. For some reason in FireFox it shows a horizontal scroll bar like below: as soon as i set the second column to show the scroll bar goes away like below: In IE this displays in the same manner accept th

the area of ​​the perfect scroll bar does not scroll on the mobile

I've used meteorjs to build my website, blainehansenpiano.com, and it works and looks good on browsers and ipad. I'm using the perfect-scrollbar on the scrollable areas, and it is working fine. I'm also using bootstrap3, so my site can be easily view

The vertical scroll bar does not work correctly in the html table

I need to set scroll for tbody if number of records will be more that time I view the records by using scroll bar. For that I have used vertical scrollbar for the tbody of the table. Scrollbar is working correctly in that case that all column values(

The vertical scroll bar no longer appears until I resize the window - ScrolledFormText - Java

I created a ScrolledFormText containing a FormText using java and SWT. The problem is that when the window containig this ScrolledFormText opens and i start filling it with text until the text passes the end of the ScrolledFormText a scrollbar doesn'

The horizontal GWT Datagrid scroll bar does not appear

i have a small screen and i want the horizontal scrollbar on datagrid to appear automatically. i've used: dataGrid.setMinimumTableWidth(1500, Unit.PX); this sets the width both the scrollbar still not appear any tip?I had a similar problem. When usin

The horizontal scroll bar does not work in bootstrap mode

I am having a modal, showing div in 'modal-body'. <div class="modal-body"> <div class="scoll-tree"> <div class="history"> Report Event Details </div> <div class="history"> Report Event

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK