Centering div in space next to floating element

[Lee K. Seitz]

I stayed up late working on a CGI script and spent some time
formatting my page with CSS. It looked fine in IE, which will be 95%
of my audience, so I went to bed. Got up and looked at it in Opera
and it's different and not what I wanted.

Take a look at <http://home.hiwaay.net/~lkseitz/hhs/rnb/>. I'm
concerned with the form and links in the dashed box in the middle of
the page. In IE, my "margin: auto" causes the div to center itself in
the space between the left of the page and the floating image to the
right. In Opera, the div is centered over the entire window. If the
window is sized down such that the form hits the floating image,
ugliness ensues.

The IE behavior is what I desire. Most of the relevent CSS
information is in the HTML itself. (The image's class is in
<http://home.hiwaay.net/~lkseitz/hhs/hhs.css>.) Any tips on the
proper way to get it? Thanks.

(And if anyone wants to tell me the proper way to style the table at
the bottom with CSS, rather than using HTML attributes, feel free to
speak up! But that's not my primary concern at the moment.)

--
lkseitz (Lee K. Seitz) .at. hiwaay @dot@ net
Believe in the Bible? Heck! I've SEEN one!

[Lauri Raittila]

In article <10*************@corp.supernews.com>, lk*****@see.my.sig
says...

Take a look at <http://home.hiwaay.net/~lkseitz/hhs/rnb/>. I'm
In IE, my "margin: auto" causes the div to center itself in
the space between the left of the page and the floating image to the
right.
Yes, there seems to be bug on IE.
Most of the relevent CSS information is in the HTML itself.
BAD. More ugly is that your CSS is 3 places, external file (good),
embedded (OK for tests), inline (hardly ever good idea)
Any tips on the proper way to get it? Thanks.
Easiest way is to wrap blue dashed bordered div to other div, and give
that new div margin-right same size as your image.

If you don't like having elements just for styling, use padding-right for
body etc. and negative margins on other stuff. I don't recommend. You
might also try margin for current div and putting border to its child
elements, but I don't think it will work with dashed border...
(And if anyone wants to tell me the proper way to style the table at
the bottom with CSS, rather than using HTML attributes, feel free to
speak up! But that's not my primary concern at the moment.)

tr:first-child {background:#666;color:#000}
tr:first-child > th + th {background:yellow;clor:#000;}
table {border-collapse:collapse}
td,th {border:3px ridge;}

In IE, does not work. Should work on Firefox and Opera, if Table is
marked up correctly. Replace complicated selectors with classes, and IE
should do it too.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>

[Lee K. Seitz]

In article <MP************************@news.individual.net> ,
Lauri Raittila <la***@raittila.cjb.net> wrote:

Yes, there seems to be bug on IE.
And it's always a pain when the IE bug ends up being the desired look.
8)

Most of the relevent CSS information is in the HTML itself.

BAD. More ugly is that your CSS is 3 places, external file (good),
embedded (OK for tests), inline (hardly ever good idea)

I tend to agree, but this is still a work in progress. This is also
the only place this particular style (the inlined dashed box) will be
used. The embedded styles I grabbed from another page from a
different "site" of mine. Which means I'm using it more than once and
should probably stick it in it's own stylesheet, as you say. Although
I think I changed the width, come to think of it.
Easiest way is to wrap blue dashed bordered div to other div, and give
that new div margin-right same size as your image.

Ah, just what I needed! Thanks. For some reason I always forget
about setting margins for things like this. Which is sad because I
used that technique on one of my sites. Although I'm not sure the
double div would have occurred to me.

And let me apologize for the HTML on that page. It's generated by a
script, which means there aren't nearly as many line breaks (not to
mention as much indenting) as there should be. I hadn't thought about
that when I posted.

--
lkseitz (Lee K. Seitz) .at. hiwaay @dot@ net
BBS flashback:
* SLMR 2.1a * This tagline is umop apisdn