Skip navigation

Category Archives: html

Try this page out.

Remove the <!doctype> declaration at the top of the page to see quirks mode in action.


<!doctype html>
<html>
<head>
<style>
ul
{
  list-style-type: none;
}

li
{
  /*
    ie old rules width referred to 
    the combination of borders,
    padding, AND what's inside the element.
    
    standards say WIDTH EXCLUDES PADDING, borders.
  */
  margin: 20px ;
  padding: 20px 40px;
  width: 250px;
  border: solid 2px black;
  background-color: #eee;
}
</style>
</head>

<body>
  <ul>
    <li>Digger</li>
    <li>Styx</li>
    <li>Heroes of might and magic</li>
    <li>world of warcraft</li>
  </ul>
</body>
</html>

Advertisements

Well, sometimes it doesn’t work as you’d like:

html like:

<div style=”overflow: scroll”>
i want this text to force a horizontal scrollbar if it overflows at the right yeaaaaaaaaaaaaaaaaaaaaah
</div>

On firefox at least, it doesn’t give a nice horizontal scrolly.

To force it, surround the <div> in a <pre> tag.

<pre style=”font-family: arial”> <– you aren’t forced to use monospace just because in pre –>
<div style=”overflow: scroll”>
i want this text to force a horizontal scrollbar if it overflows at the right yeaaaaaaaaaaaaaaaaaaaaah
</div>
</pre>