CSS problem

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
Hey everyone,

I am in somewhat of a pickle. I am trying to create a border around a page

I have made 3 images, respectively the left-, middle- and rightside. So far
the middle section is working, but it would appear that the left and right
sides are not. I have no clue what's wrong here. As far as I can see
this -should- work. Well obviously it doesn't.

Can someone help me out to settle this issue?

Thanks a million!


Page url:  http://www.kurvalyn.com/testsite/test.html

CSS coding:
body {
 background-color : #faf3e3;
 color     : #404040;
 margin    : 5px 5px 5px 5px;
 font-family   : "High Tower Text", fantasy;
 font-size   : 11px;

/* Page Header Styles */
div.PageHeader {
 float     : left;
 width     : 100%;
 font-size   : 4em;
 font-variant  : small-caps;
 height    : 48px;
 vertical-align  : middle;
div.PageHeaderLeft {
 position    : absolute;
 top     : 5px;
 right     : 5px;
 background-image : url(../images/hd_left.gif);
 background-repeat : no-repeat;
 height    : 48px;
 margin    :  0;
div.PageHeaderMiddle {
 position    : relative;
 background-image : url(../images/hd_middle.gif);
 background-repeat : repeat-x;

div.PageHeaderRight {
 float     : right;
 background-image : url(../images/hd_right.gif);
 background-repeat : no-repeat;
 height    : 48px;
 margin    :  0;

Re: CSS problem

Kevin wrote:

Quoted text here. Click to load it

Looking at the source at:


I can see the following in div.PageHeaderMiddle:

  margin-left : 5px;
  margin-right : 5px;

You probably want these to be 0 in value. In your original post you do not
have these attributes...


Roy S. Schestowitz

Re: CSS problem

Kevin wrote:
<snip code>
Quoted text here. Click to load it
If you are using images are your header why make them background, just
put them in the header div and be done with it. Why use an image to
create the boarder? If you want the dots in the corner and your header
text is an image, create the image with just the dots in the corner and
put the image in a div with a 1 px black border...

If you want to add text to this header div it gets more complicated,
with CSS you can spec corners on your div border but your are going to
have trouble with legacy browsers and IE

Take care,

Site Timeline