IE/FF Compatibility problem with div and white-space

[n_e]

Hi all,

I'm using a div as a pop-up on a page to show some addtional information.
First some code:

<td>
<div class="floatingDiv" id="popup">
some txt here...
</div>
			
<p style="margin-top: 0px" onMouseOver="ShowContent('popup',0); return true;" onMouseOut="HideContent('popup'); return true;" >
.. short message here
</p>
</td>

.floatingDiv
{
	display: none;
	position: absolute;
	border: 1px solid #000000;
	background-color: #FFFFEE;
	padding: 10px;
	font-size: 8pt;
	/*white-space: pre-line;*/
}

So when I hover the short-text, a popup shows and displays: " some txt here...". This works.

However: I have a problem with the wrapping of the text. When viewing this in FF3 it shows correct:

some txt here...

In IE7 however, it shows as:

some
txt
here...

So I surfed around a bit and found white-space: nowrap; . This fixes the problem with wrapping in IE, but gives new problems when the shown text exceeds the width of the screen. I've also tried other options as line-wrap, pre-wrap and pre. But they all have the same behaviour on IE as default.
Is there another option that I can use?

[dipak_passion]

Hello!
Just assign widht at '.floatingDiv' hope that will solved your issue.

[n_e]

Hello!
Just assign widht at '.floatingDiv' hope that will solved your issue.

It could, but that's not desired functionality. The text can be an a random place in a page, so if I assign a fixed-width to the div, the chance exists that the div will still exceed the width of the page if the text is on the right side of the screen.

[n_e]

So I've tried using a fixed width and it worked as you expected. But since I really would like to this without using fixed-width, I was looking at min-width: , but this apperantly was never implemented in IE, so it doesn't work either.. Does anyone have some other ideas? I'd like to do this with html/css only and no Javascript etc if it's possible.

[dipak_passion]

I think in IE6 and its later version you are getting this, insteed of that you can use

white-space:nowrap

, but other issue will arise. Betting assign fixed width where height will be flexible. Content will be fitted best.