CSS nightmare with positioning

[Jim Elander]

Hi,
I have a simple, but maddening problem, that I need help with ---before I
shoot myself! I have created 3-.jpegs, for use as a a top-side-bottom graphic.
I have created an external style sheet and tried numerous variations
(box-positioning-margin etc.) to try and get the CSS pseudo-ids to render on a
web browser correctly.....usually I get the "top" graphic to display as a thin
line...not 150px..as expected...So, looking at the code below could someoine
give me some general hints, to get my top-side-bottom graphics to render
correctly (the full graphics at the top-side-bottom) in my web
browser....????please help??

#side_graphic {
position:relative;
width:110px;
height:auto;
z-index:2;
left: 10px;
top: 183px;
visibility: visible;
background-image: url(../images/side_graphic.jpg);
background-repeat: no-repeat;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#top_graphic {
position:relative;
width:1150;
z-index:1;
left: 10px;
top: 33px;
visibility: visible;
background-image: url(../images/top_graphic_title.jpg);
background-repeat: no-repeat;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
height: 150px;
}
#footer_graphic {
position:relative;
width:1150px;
height:27;
z-index:3;
left: 10px;
top: 593px;
visibility: visible;
background-image: url(../images/bottom_graphic.jpg);
background-repeat: no-repeat;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

[Murray *ACE*]

Just off the top of my head -

> width:1150;

Need units on this value.

> height:27;

Ditto.

--
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
[url]http://www.dreamweavermx-templates.com[/url] - Template Triage!
[url]http://www.projectseven.com/go[/url] - DW FAQs, Tutorials & Resources
[url]http://www.dwfaq.com[/url] - DW FAQs, Tutorials & Resources
[url]http://www.macromedia.com/support/search/[/url] - Macromedia (MM) Technotes
==================


"Jim Elander" <webforumsuser@macromedia.com> wrote in message
news:e4ffej$cu9$1@forums.macromedia.com...

> Hi,
> I have a simple, but maddening problem, that I need help with ---before I
> shoot myself! I have created 3-.jpegs, for use as a a top-side-bottom
> graphic.
> I have created an external style sheet and tried numerous variations
> (box-positioning-margin etc.) to try and get the CSS pseudo-ids to render
> on a
> web browser correctly.....usually I get the "top" graphic to display as a
> thin
> line...not 150px..as expected...So, looking at the code below could
> someoine
> give me some general hints, to get my top-side-bottom graphics to render
> correctly (the full graphics at the top-side-bottom) in my web
> browser....????please help??
>
> #side_graphic {
> position:relative;
> width:110px;
> height:auto;
> z-index:2;
> left: 10px;
> top: 183px;
> visibility: visible;
> background-image: url(../images/side_graphic.jpg);
> background-repeat: no-repeat;
> margin-top: 0px;
> margin-right: auto;
> margin-bottom: 0px;
> margin-left: auto;
> }
> #top_graphic {
> position:relative;
> width:1150;
> z-index:1;
> left: 10px;
> top: 33px;
> visibility: visible;
> background-image: url(../images/top_graphic_title.jpg);
> background-repeat: no-repeat;
> margin-top: 0px;
> margin-right: auto;
> margin-bottom: 0px;
> margin-left: auto;
> height: 150px;
> }
> #footer_graphic {
> position:relative;
> width:1150px;
> height:27;
> z-index:3;
> left: 10px;
> top: 593px;
> visibility: visible;
> background-image: url(../images/bottom_graphic.jpg);
> background-repeat: no-repeat;
> margin-top: 0px;
> margin-right: auto;
> margin-bottom: 0px;
> margin-left: auto;
> }
>