Scroll in div if necessary

Navigation
5

I have the following div on my page html 

<div id="divContent" class='content'>
            Bem vindo ao meu site <br />
            1 index index index index index index index index <br />
            2 index index index index index index index index <br />
            3 index index index index index index index index <br />
            4 index index index index index index index index <br />
            5 index index index index index index index index <br />
            6 index index index index index index index index <br />
            7 index index index index index index index index <br />
            8 index index index index index index index index <br />
            9 index index index index index index index index <br />
            10 index index index index index index index index <br />
            11 index index index index index index index index <br />
            12 index index index index index index index index <br />
            13 index index index index index index index index <br />
            14 index index index index index index index index <br />                                
        </div>

Opening the page in your computer's browser , all your content is displayed . But when opening in a cell for example, content does not fit on the screen, hiding the last lines of content from DIV .

You have some way to put a scroll just if does not fit content smaller screens ?

    
asked by anonymous 19.01.2016 / 13:15

1 answer

4

You can use css to show the scroll bars. 

#divContent{
 overflow:auto; 
}

With this your div must have scroll whenever you need it. There are several options for various cases. See the definition on the W3C site. 

overflow: visible|hidden|scroll|auto|initial|inherit;

To leave this for mobile devices only, you can use MediaQuery to detect the resolution and make your changes.

Example: 

/* mobile phone */
@media all and (max-width: 768px) {
    #divContent{
     overflow:auto; 
    }
}

This CSS will be applied only in resolutions up to 768px, covering many mobile devices. Check out this jsFiddler with MediaQuery working.

    
19.01.2016 / 13:22
How to get information from .torrent files? Error in formula with OU