Prevent IE from wrapping content?

I am having a problem with content being wrapped down the page in
Internet Explorer. This is the page in question, which I have
validated:

www.lynngoldstein.com

When the browser window is reduced in size to a more narrow dimension,
Internet Explorer forces the picture down the page, which is not at all
desirable. This same behavior does not happen in Firefox. Can anyone
offer a solution to prevent this from occurring without introducing a
horizontal scrollbar?

Thank you for your time in replying,
-M

mercurius_1 (AT) yahoo (DOT) com wrote:

I am having a problem with content being wrapped down the page in
Internet Explorer. This is the page in question, which I have
validated:

www.lynngoldstein.com

When the browser window is reduced in size to a more narrow dimension,
Internet Explorer forces the picture down the page, which is not at all
desirable. This same behavior does not happen in Firefox. Can anyone
offer a solution to prevent this from occurring without introducing a
horizontal scrollbar?

Firefox produces a scrollbar, if that's not what you want either, what
*do* you want to see happening?

Btw, nice design, but there's considerable room for improvement
regarding your code. Validation is a start, but to create proper code
you should spend some time learning how to code without using the
"WYSIWYG" mode in Dreamweaver, once you've dome that you will be able to
return to using "WYSIWYG" mode but with less mucky results.

--
Spartanicus

Spartanicus wrote:

Firefox produces a scrollbar, if that's not what you want either,
what
*do* you want to see happening?

----> I don't see a scrollbar in my environment....Probably a version
difference. Anyways, I want the picture to stay within the same line as
the horizontal color bands. I do not want the browser software to push
it down to the bottom of the page when the browser window is narrowed
down to a smaller dimension. If I must suffer a horizontal scrollbar,
so be it, but it would be preferable to avoid it.

Btw, nice design, but there's considerable room for improvement
regarding your code. Validation is a start, but to create proper code
you should spend some time learning how to code without using the
"WYSIWYG" mode in Dreamweaver, once you've dome that you will be able
to
return to using "WYSIWYG" mode but with less mucky results.

----> Yes, yes, this I know. I taught myself to handcode HTML back in
'95; so that's not the issue here (I choose not to do so anymore
because it is less time consuming to use WYSIWYG. The reality is that
my clients don't care whether the code is 100% clean & pure, only that
it gets done in a timely fashion). The larger issue here is my limited
knowledge of CSS and how to beat IE into submission on the content
wrapping. Hence the reason for this post. Thank you for your time in
replying.

mercurius_1 (AT) yahoo (DOT) com wrote:

----> I don't see a scrollbar in my environment....Probably a version
difference. Anyways, I want the picture to stay within the same line as
the horizontal color bands. I do not want the browser software to push
it down to the bottom of the page when the browser window is narrowed
down to a smaller dimension. If I must suffer a horizontal scrollbar,
so be it, but it would be preferable to avoid it.

How would users with a smaller viewport be able to see the rest of the
picture without a hor scrollbar? You could remove it with CSS, but I
can't see why you would want to.

The reality is that
my clients don't care whether the code is 100% clean & pure, only that
it gets done in a timely fashion). The larger issue here is my limited
knowledge of CSS and how to beat IE into submission on the content
wrapping.

Fair enough, use a 3 cell html table for the navigation, picture and
right side coloured box.

Btw, you should add "z-index:1" to the name/logo gif, currently it
doesn't stack properly in Opera.

--
Spartanicus

Thanks for the response, I may have to go that route. But I was really
hoping to avoid the old HTML table crutch. I wanted to achieve this
layout more with CSS....Any additional ideas?
Thank you for your response.
-M

mercurius_1 (AT) yahoo (DOT) com wrote:

Thanks for the response, I may have to go that route. But I was really
hoping to avoid the old HTML table crutch. I wanted to achieve this
layout more with CSS....Any additional ideas?

Sure, but since your clients don't care, you being css challenged, and
time/money being an issue, why would you want to? Given the content &
layout, using a table for layout is unlikely to cause problems for users
of the site.

The 3 main methods (floats, abs positioning, and IE bugs) available to
get IE to play ball are fraught with potential issues that sometimes lie
hidden just beneath the surface. Getting css layouts to work in IE
requires finely tuned css skills, without that people often do more
damage to the quality than they are aware of.

The page at the url you posted is simple enough for us to convert into a
css layout, but without the underlying knowledge, using it would likely
result in a site that causes more problems for users than a html table
layout would.

If you, in the spirit of new year resolutions, feel the need to move
away from "crutches", I suggest tackling the other issues I alluded to,
those, unlike a table hack are much more likely to cause problems for
users.

I'd suggest tackling these issues:

1) Text zooming breaks the layout (use the em unit to size the width of
the left box containing the navigation).
2) The stacking problem in Opera I mentioned.
3) Marking up the nav links as a unordered list.
4) Changing the charset specified via the meta element to something more
friendly (currently a Windows char set).
5) Removing the presentational bits from the html and switch to a Strict
doctype.
6) Remove those awful <p>&nbsp;</p> contraptions and switch to css
margins and padding.
7) The current layout blank space specified using the px unit doesn't
scale to different viewport sizes, using % as the unit would help
considerably.

--
Spartanicus

Thank you for all of the advice. There are indeed things that need to
be addressed through CSS, but having to use a "table hack" afterall to
achieve the main goal of the layout is just yet another example of why
I got out of this profession on a fulltime basis four years ago. It's
ridiculous that the implementation of this technology is still
inconsistent within a major browser and requires such finely tuned
skills as you described. Not sure how the W3C actually expects anyone
to embrace it or use it with any degree of regularity.
OK, off of my soapbox now.
Thank you.
-M

mercurius_1 (AT) yahoo (DOT) com wrote:

It's
ridiculous that the implementation of this technology is still
inconsistent within a major browser and requires such finely tuned
skills as you described.

No argument from me on that note, web authoring should not require such
elaborate skills, reasonable quality web authoring should be open to the
non technically inclined. The fact that it's not can only partially be
blamed on Microsoft, alas the ludicrously technical and complex css
specification is also to blame for that.

It's not commonly recognized, but the failure to draw up a high quality
style spec is also the root cause for many of the browser css bugs. The
css float and absolute positioning rules are a case in point. Modern
browsers, including the "good" ones, are still riddled with float and
positioning bugs.

The ludicrously technical and complex spec combined with browser bugs
has in turn imo been a considerable factor in preventing the emergence
of WYSIWYG authoring packages that exclusively use css for
presentational issues. The remaining blame falls on the lack of features
in css that designers want, vertical centering is but one example of
that.

--
Spartanicus