Page 1 of 1

How do I center the Heading image on the page [Solved]

Posted: Fri Mar 02, 2007 2:22 pm
by Clive
Using the basic Template: left simple navigation + 1 column
I have changed the heading image but how do I center that image on the page?
I need this for when the page is viewed on a larger screen size.




CMSMS v 1.0.2

Thanks

Re: How do I center the Heading image on the page

Posted: Fri Mar 02, 2007 2:47 pm
by RonnyK
Clive,

what if you change the folowing in your css

DIV#header H1 A {
DISPLAY: block; BACKGROUND: url(images/kilkenny_hurling_logo.jpg) #ffffff no-repeat 0px auto; TEXT-INDENT: -999em; HEIGHT: 80px; TEXT-DECORATION: none
}

Instead of 12px from the left it will center.

Ronny

Re: How do I center the Heading image on the page

Posted: Fri Mar 02, 2007 2:57 pm
by heatherfeuer
Actually, the easiest way I've found to center a particular element is to give it a "margin: 0 auto;" in the css for the element.

Re: How do I center the Heading image on the page

Posted: Fri Mar 02, 2007 3:11 pm
by Clive
RonnyK when iI put UR script in the heading image vanishes.


My present Script is:

div#header {
  height: 80px;    /* adjust according your image size */
  background: #ffffff;         
}

div#header h1 a {
/* you can set your own image here */
  background: #ffffff url(images/kilkenny_hurling_logo.jpg) no-repeat 0 12px;
  display: block;
  height: 80px;            /* adjust according your image size */
  text-indent: -999em;  /* this hides the text */
  text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}


Where would I place the "margin: 0 auto"???? text in my script?

Re: How do I center the Heading image on the page

Posted: Fri Mar 02, 2007 3:36 pm
by RonnyK
Clive,

my mistake, just add

Code: Select all

background-position: center
To your "div#header h1 a".

Ronny

Re: How do I center the Heading image on the page

Posted: Sat Mar 03, 2007 8:57 am
by Clive
Sorted
The image disappeared again UNTIL I noticed that the semi-colon was missing from the end of the text
background-position: center;
thanks Ronny.