Question: On one of my web pages I have a DIV element, containing string of text inside, which is of, say, 1.1em size. For example:

```
<div id="displaydiv">
    <b>Hello World</b>
</div>

```

Another page has the same DIV element, but with no text inside it at all. And that's why this DIV has the visual height of less value than the one on the first page. 

```
<div id="displaydiv">

</div>

```

What is the recommended way of keeping the DIV element on the second page of the same height as on the first one?

Answer: 
Try putting an `&nbsp;` inside. 

If the page is dynamically generated and your template language supports conditionals, make sure only to show the `&nbsp;` when there's no content. 

Otherwise, if you can't show it only when empty, to avoid messing up your text alignment (thanks to [@bensiu](https://stackoverflow.com/users/367878/bensiu) for pointing this out), stick the `&nbsp;` at the end of the string (or beginning if the text is right-aligned). If it's center-aligned, you can put an `&nbsp;` on both ends.
If you would like it to be the same height as on the other page, you could do this by passing a parameter to the next page, like with `$_GET` in `PHP`.

You could use jQuery to exactly measure the height of your div (with [`.height()`](http://api.jquery.com/height/)). Then, when going to your new page, you should do something like: `myDomain.com/newPage?height=500`. Use PHP to evaluate your new height in the new page.