Follow Up Question about shadow Images

Question

Hello!
A couple weeks ago I asked about drop shadows set with images
and I was
given some helpful
advice. Something came up and I wasn't able to get back to
putting the
information into application until a couple days ago. Forgive
my ignorance
but another question has surfaced. Many here advocate that a
serious web
page maker learn the ins and outs of HTML and CSS. I have
been making
significant headway in both. Some unanswered questions
persist and while I
can ferit it out
through more reading and experiementing, it seems best, for
expedience sake
to ask
the question that is effecting my immediate situation. I have
three images - top, center (this one repeats), and bottom -
that I am trying
to place as a background. Here is the CSS that I
have written for the accasion, based on the advice given here
on this forum.
The problem I am having is applying the div tags in the
correct manner that
will give me the results I am looking for. Here is how the
code renders
through IE 7:
http://www.ors-llc.com/AboutORS/experiment.html.
As you see
the images are not one continuous background image. Obviously
I have
something wrong here; can anyone advise?
Thank you in advance.
#middlediv {
background-repeat: repeat-y;
background-position:center;
background-image:
url(../Sitewide%20CSS,%20Images,%20etc/Images/Background%20Images%20for%20Text%20Area/mai nrepeat.gif);
#bottomdiv {
background-repeat: no-repeat;
background-image:
url(../Sitewide%20CSS,%20Images,%20etc/Images/Background%20Images%20for%20Text%20Area/mai nbottom.gif);
background-position: center bottom;
#topdiv {
background-repeat: no-repeat;
background-image:
url(../Sitewide%20CSS,%20Images,%20etc/Images/Background%20Images%20for%20Text%20Area/mai ntop.gif);
background-position: center top;
<div id="centercol">
<div class="topdiv"></div>
<div class="middlediv"></div>
<div class="bottomdiv"></div>
</div>

Answer 1

Good luck!
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Webdesigner" <[email protected]> wrote in message
news:[email protected]...
> Thank you! That worked very nicely. Thank you for the
other tips as well.
> Very helpful and appreciated.
>
> Best Regards
> Webdesigner
>
> "Murray *ACE*" <[email protected]>
wrote in message
> news:[email protected]...
>> Most importantly, stop using file/pathnames that
contain spaces. This
>> will bite you when you least expect it.
>>
>> Then control the top/bottom margins on the <p>
tags in those divs. The
>> gap you are seeing is due to the top/bottom margin
here -
>>
>> <div id="middlediv">
>> <p>sdftgsdfg</p>
>> </div>
>>
>> There's no need to declare position:static, as it's
the default -
>>
>> position:static;
>>
>> And, such elements do not have a z-index, top, or
left property, so you
>> don't need to declare them, either.
>>
>> --
>> Murray --- ICQ 71997575
>> Adobe Community Expert
>> (If you *MUST* email me, don't LAUGH when you do
so!)
>> ==================
>>
http://www.dreamweavermx-templates.com
- Template Triage!
>>
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
>>
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
>>
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
>> ==================
>>
>>
>> "Webdesigner" <[email protected]> wrote in
message
>> news:[email protected]...
>>> Hello!
>>>
>>> A couple weeks ago I asked about drop shadows
set with images and I was
>>> given some helpful
>>> advice. Something came up and I wasn't able to
get back to putting the
>>> information into application until a couple days
ago. Forgive my
>>> ignorance
>>> but another question has surfaced. Many here
advocate that a serious web
>>> page maker learn the ins and outs of HTML and
CSS. I have been making
>>> significant headway in both. Some unanswered
questions persist and while
>>> I can ferit it out
>>> through more reading and experiementing, it
seems best, for expedience
>>> sake to ask
>>> the question that is effecting my immediate
situation. I have
>>> three images - top, center (this one repeats),
and bottom - that I am
>>> trying
>>> to place as a background. Here is the CSS that I
>>> have written for the accasion, based on the
advice given here on this
>>> forum.
>>> The problem I am having is applying the div tags
in the correct manner
>>> that
>>> will give me the results I am looking for. Here
is how the code renders
>>> through IE 7:
http://www.ors-llc.com/AboutORS/experiment.html.
As you
>>> see the images are not one continuous background
image. Obviously I have
>>> something wrong here; can anyone advise?
>>>
>>> Thank you in advance.
>>>
>>> #middlediv {
>>> background-repeat: repeat-y;
>>> background-position:center;
>>> background-image:
>>>
url(../Sitewide%20CSS,%20Images,%20etc/Images/Background%20Images%20for%20Text%20Area/mai nrepeat.gif);
>>> }
>>> #bottomdiv {
>>> background-repeat: no-repeat;
>>> background-image:
>>>
url(../Sitewide%20CSS,%20Images,%20etc/Images/Background%20Images%20for%20Text%20Area/mai nbottom.gif);
>>> background-position: center bottom;
>>> }
>>> #topdiv {
>>> background-repeat: no-repeat;
>>> background-image:
>>>
url(../Sitewide%20CSS,%20Images,%20etc/Images/Background%20Images%20for%20Text%20Area/mai ntop.gif);
>>> background-position: center top;
>>> }
>>>
>>> <div id="centercol">
>>> <div class="topdiv"></div>
>>> <div class="middlediv"></div>
>>> <div class="bottomdiv"></div>
>>> </div>
>>>
>>>
>>>
>>
>>
>
>