1

I am writing a web application targeting the Blackberry Browser 4.2. I want to had some vertical spacing between a list of links. I know 4.2 doesn't support padding and margin but I thought it supported height or line-height. I can't get either to work.

I really don't want to use a line break. Any suggestions

Maksym Gontar
  • 22,765
  • 10
  • 78
  • 114

2 Answers2

1

Table and image space holder

You can use table and some transparent image as a space holder: 

<html>
 <table>
  <tr>
   <td>
    <a href = 'http:\\www.google.com'>link 1</a>
   </td>
  </tr>
  <tr>
   <td>
    <a href = 'http:\\www.google.com'>link 2</a>
   </td>
  </tr>
  <tr>
   <td>
    <img src = 'spaceholder.gif'/>
   </td>
  </tr>
  <tr>
   <td>
    <a href = 'http:\\www.google.com'>link 3</a>
   </td>
  </tr>
 </table>
</html>

Make a small image and use it several times for more precise spacing

Undo
  • 25,519
  • 37
  • 106
  • 129
Maksym Gontar
  • 22,765
  • 10
  • 78
  • 114
  • I had to remove the images from your post because ImageShack has deleted them and replaced them with advertising. See http://meta.stackexchange.com/q/263771/215468 for more information. If possible, it would be great for you to re-upload them. Thanks! – Undo Sep 22 '15 at 00:46
1

I don't think you should feel the need to make things look pretty on BlackBerry browsers, especially ones pre-4.6 (and even then, yeesh). Sure, keep things organized, but making things look nice on a specific browser is way too frustrating and short lived. For example, here's an unordered list (<ul>) with some CSS Style, and look at the difference between 4.2 and 4.3:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Hello.</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body{background: #FFFFFF;font: 85% Calibri,sans-serif;}
h1{ font-size:120%; color: #06F;}
h2 { font-size:110%; color: #06F;}
h3 { font-size:105%; color: #F60;}
ul { list-style: none;}
a{color: #00F;text-decoration:underline}
div#container{width:280px;}
</style>
</head>
<body>
  <div id="container">     
    <p>     
      <ul>
        <li>&nbsp;</li>
        <li><p><h2>Your BlackBerry App</h2></p></li>  
        <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae nulla sit amet ligula sollicitudin suscipit ut eget turpis.</li>
        <li>&nbsp;</li>
        <li><a href="resources">Tools</a></li>
        <li>&nbsp;</li>
        <li><a href="builds">Builds</a></li>
        <li>&nbsp;</li>
        <li><a href="">Another link</a></li>
      </ul>
    </p>   
  </div>
</body>
</html>

alt text http://www.freeimagehosting.net/uploads/eaacad53a6.png

clafonta
  • 256
  • 2
  • 3