How can I set a height of document [duplicate]


Tags: javascript,html,css

Problem :

Possible Duplicate:
How to create a custom scrollbar on a div

I'm having the following body

<div id="app-container">
    <div id="canvas-container">
        <div id="canvas"></div>
    </div>
</div>

In CSS I have:

#canvas {
  position: absolute;
  background-color: transparent;
  width: 100%;
  height: 100%;
}

#app-container {
  height: auto !important;
  min-height: 100%;
}

#canvas-container {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

after that I'm adding divs (with jquery.appendTo and jquery.offset) to <div id="canvas"></div> with

display: inline-block;
position: absolute;

in CSS. So adding such a div cannot affect document size. If I add many divs some of them can be located below the edge of screen. How can I add a scrollbox, so that I can see all of divs?



Solution :

The property overflow: auto and height: (required height) inside the #canvas should make all the divs inside that visible.

I have used this few times in my application. Hope I didn miss anything thats very obvious.


    CSS Howto..

    How can I use CSS or Javascript to switch images on mouseover as simple and lightweight as possible?

    How to adjust the application with equal resolution in different browsers? [closed]

    How to Bring a h1 to top of the div?

    css transition effects on show/hide element using css3 [duplicate]

    Rails4: How to create Image Links with Hover?

    How to apply a defined class to a new class in my css?

    show,hide DIV with mouseover , mouseout

    How to remove some css properties without the paticular one using regular expression?

    How to put borders closer to the text and image and make background gray in CSS?

    CSS: How to set several div's in one line with 100% width?

    In html, how is a child element's percentage-based size calculated when its parent has padding?

    How can I make my CSS update consistently? [closed]

    How to centralise navigation bar

    How to display a border-bottom only if table cells are not empty (CSS)

    How to make child divs visible in tympanus.net's CSS Radio Checked Tab Method

    How to Add Class to Bootstrap Thumbnails on Slider Change

    How to create a horse-shoe-like gauge using CSS

    Openlayers Map is shown only if the CSS contains a syntax error

    How to stop web content from being displayed before css/jquery is prepared?

    How to make round circle links responsive in css?

    how to change a css of an input if the value of it is not empty in angularJS

    How to edit and see live CSS effect in IE8 like we see in Firefox > Web developer toolbar > Edit CSS function?

    How to correctly override default JavaFX 8 CSS on TableView

    How to restore WordPress theme style,css from caches on internet

    How to set an image when we select its sub menu

    How to set cursor off screen?

    How Do I Set the condition for a user to have to fill in a Textfield

    How to center webpage content

    How to feature detect for CSS custom properties? [duplicate]

    Show/hide without using CSS