<div position: relative> rendered to the far, far right...

[rydan]

Hello there!

I have used joomla to build a very simple site. I use JA Purity template, a menu with only article layouts, and a bunch of articles. Since I want my articles to have margin justified text with control over layout, I use a fixed width by containing all content in a relative position div. So, each article starts with:

<br /><div style="overflow: hidden; position: relative; width: 650px; height: 2000px">

SO far so good. This works fine in IE and Firefox. However, in Safari, the contents of the articles are rendered waaay out to the right on the page, to the right of the bar containing the print and email buttons inserted by JA Purity. Why is this, and is there any workaround?

[rydan]

I'll answer it myself:
<p style="margin: 0px; line-height: 0%">&nbsp;</p>
<div style="overflow: hidden; position: relative; width: 650px; height: 2000px">

[Klear]

The default positioning for all elements is position:static, which means the element is not positioned and occurs where it normally would in the document.

Normally you wouldn't specify this unless you needed to override a positioning that had been previously set.

[rydan]

The default positioning for all elements is position:static, which means the element is not positioned and occurs where it normally would in the document.

Normally you wouldn't specify this unless you needed to override a positioning that had been previously set.

Yes, but then my text area width (and text layout) will be adjusted whenever a user changes window size. Don't want that...