«

Seemingly simple request:

Positioning either text or an image (the word "SOLD") over a paragraph.

I could set in a background-image, but that wouldn't be on top. I can't
think of a decent way to do this with relative positioning (might as
well use margins).

Any ideas?

Jeff

you have to use DHTML.

look into layers and absolute positioning.

if you want to make it diagonal - i think you'll have to use
an image.

"Jeff Thies" <> wrote in message
news:czsEe.7938$ nk.net...
> Seemingly simple request:
>
> Positioning either text or an image (the word "SOLD") over a paragraph.
>
> I could set in a background-image, but that wouldn't be on top. I can't
> think of a decent way to do this with relative positioning (might as
> well use margins).
>
> Any ideas?
>
> Jeff

ppcguy wrote:

> you have to use DHTML.

Why?

This is close to what I want:

<div style="font-size: 3em;position: relative;top: 1em;font-weight:
900;font-family: Verdana,sans-serif;color: red;z-index: 1">SOLD</div>
<p style="position: relative;top: -5em;margin-bottom: -5em; width: 200px">
xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
</p>
<p>following paragraph</p>

Jeff
>
> look into layers and absolute positioning.
>
> if you want to make it diagonal - i think you'll have to use
> an image.
>
> "Jeff Thies" <> wrote in message
> news:czsEe.7938$ nk.net...
>
>>Seemingly simple request:
>>
>>Positioning either text or an image (the word "SOLD") over a paragraph.
>>
>>I could set in a background-image, but that wouldn't be on top. I can't
>>think of a decent way to do this with relative positioning (might as
>>well use margins).
>>
>> Any ideas?
>>
>> Jeff
>
>
>

Jeff Thies wrote:

> Why?
>
> This is close to what I want:
>
> <div style="font-size: 3em;position: relative;top: 1em;font-weight:
> 900;font-family: Verdana,sans-serif;color: red;z-index: 1">SOLD</div>
> <p style="position: relative;top: -5em;margin-bottom: -5em; width: 200px">
> xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
> xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
> xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
> xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
> xxxxxxxxxxxxxxxx xxxxxxxx xxxxxxxx xxxxxxxxx
> </p>
> <p>following paragraph</p>

I think you're pretty much there with that anyway. It's always going to
shift about with varying font-sizes.

http://www.brightonfixedodds.net/test/overlay.html

--
Robert
http://brightonfixedodds.net

Robert Frost-Bridges wrote:

> I think you're pretty much there with that anyway. It's always going to
> shift about with varying font-sizes.
>
> http://www.brightonfixedodds.net/test/overlay.html


and browsers.

--
Robert
http://brightonfixedodds.net

Robert Frost-Bridges wrote:
> Robert Frost-Bridges wrote:
>
>
>>I think you're pretty much there with that anyway. It's always going to
>>shift about with varying font-sizes.
>>
>>http://www.brightonfixedodds.net/test/overlay.html
>
>
>
> and browsers.

This looks pretty much the same in NS7.2, IE6 and Opera 7 (windows).
Haven't fired up the Mac yet. Have you noticed anything really off?

My first thought on this was to drop a little script in that would
look for every instance of class "sold" and measure the height of the
following paragraph and adjust accordingly. I'm not sure that is
necessary. I'm a bit concerned with compensating for the whitespace that
the "SOLD" image or text leaves. Note the space before "too late".

Jeff

>