All geek questions in one place

Add scroll to html

I have a popup with the following source code ("likes.php"):

<!DOCTYPE html> <html> <head> <title>Like</title> <meta content="text/html;charset=utf-8" http-equiv="Content-Type"> </head> <body> <ol> <?php for($i=0;$i<500;$i++){ ?> <li><p><?php echo $i ?></p></li> <?php } ?> </ol> </body> </html>

Now the problem is that although all paragraphs are created, I don’t see them because there is no scroll bar. How to connect a scrollbar to my page?

Print Link

It works on chrome, but not in firefox IF , it appears in a popup window (other calls to window.open files ("likes.php"). It works in both browsers in regular windows.

+4
source share
2 answers

Use the css overflow property. Add this to your <head> :

 <style type="text/css"> body, html { margin: 0; padding: 0; height: 100%; } .scroller { overflow: scroll; padding: 5px; height: 100%; } </style>

To add a horizontal or vertical scrollbar, use overflow-x or overflow-y , respectively.

You will also want to fix the closing tag of your <li> element and transfer it to the appropriate container, for example

 <div class="scroller"> <ul> <?php for($i=0;$i<500;$i++) echo "<li>".$i."</li>"; ?> </ul> </div>
+4
source

To control overflow, you usually need to use the CSS overflow property

 overflow: scroll

as indicated by pswg, but you will never need to apply it to the whole body as it suggests . The browser should add a scroll bar to the full page if your code is formatted correctly.

The current problem is most likely due to the fact that you are not closing the second <li> and incorrect PHP formatting. You do not need a break at the end of each line. The reason the lines are not broken is because you did not nest the <li> elements inside the <ol> or <ul> . Also, by starting your if statement, a filler, and ending inside separate php tags, just confuse the computer. Use instead:

  <?php echo "<ul>"; for( $i=0; $i<500; $i++) { echo "<li>" . $i . "</li>"; } echo "</ul>"; ?>
+1
source

Source: https://habr.com/ru/post/1469378/

More articles:


All Articles