Don't want to hide text in header; how to?

[tholler]

Hi all,
I want to use the header-section to show an Text.
When I set

  text-indent: 12em;  /* this hides the text */

instead of -999em I see the text, but I can't move it down a little.

So, how can I position a text in the headline? It should be the sidetitel.

Here is the link, so you can see how it looks like:
http://cmsms.ev-menden.de

Best regards
Thorsten

[Caspar]

div#header {
  background: #F5C724 url(images/homepage/logo1.gif) no-repeat;
  border: thin;
  padding-top: 10px;
}

div#header h1 a {
/* you can set your own image here */
  display: block;
  height: 52px;            /* adjust according your image size */
  text-indent: 9em;
  text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
  background: transparent;
}

Regards,
Caspar

[Dr.CSS]

You could try...

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

[tholler]

Hi to you all,
that's it.

Thank you

[mike_taylor]

I'm trying to do something similar, but my page http://www.1stnewbury.org.uk/index.php (very much in the early stages) shows the text right at the top of the header in FF 2.0, but in IE7.0 only the middle 10px or so of the text is shown.  I'd like to have the text centered in the header, both vertically and horizontally.

What am I doing wrong, please?

My stylesheet looks like:
div#header {
  height: 108px;    /* adjust according your image size */
  background: #333399;
}

div#header h1 a {
/* you can set your own image here */
/*  background: #333399 url(uploads/images/1N_Logo.gif) no-repeat 0 12px; */
  background: #333399 url(uploads/images/1N_Logo.gif) no-repeat 0 0px;
  padding 20px 0px 0px;
  display: block;
  height: 108px;            /* adjust according your image size */
/*  text-indent: -999em; */  /* this hides the text */
  text-align:center;  /* Added to get the Site Name in the header as well */
  color:white;          /* Added to get the Site Name in the header as well */
  text-decoration:none;  /* old firefox would have shown underline for the link, this explicitly hides it */
}

Many thanks,
Mike

[mike_taylor]

I've now got this working.  An extract from my stylesheet is below:

div#header {
  height: 68px;    /* was 108px */  /* adjust according your image size */
  padding-top: 40px;  /* height + padding = 108px, which is image height  - this pushes the text down so that is doesn't sit right at the top of the header */
  background: #333399 url(uploads/images/1N_Logo.gif) no-repeat 0 0px;
  overflow: hidden;  /* to fix the header projecting below the image in IE6.0 */
}

div#header h1 a {
  display: block;
  height: 68px;            /* adjust according your image size */
/*  text-indent: -999em; */  /* this hides the text */
  text-align:center;  /* Added to get the Site Name in the header as well */
  color:white;          /* Added to get the Site Name in the header as well */
  text-decoration:none;  /* old firefox would have shown underline for the link, this explicitly hides it */
  line-height: 1em;  /* fixes top and bottom of text being cut off by IE6.0 */
  background: transparent;
}

Thanks to the posters of the previous replies for their help.

Mike

[Gablity]

Hello,

Here some people wanted create a texte in the center (header) or to deplace the picture in vertical.

About me, I wish deplace the picture in horizontal (for example in the center of the page) AND I wish to have multiple pictures in the same header (for example 3 pictures in the header).

Could you help me ?

Thank you in advance,


Gablity

[RonnyK]

Check

http://forum.cmsmadesimple.org/index.ph ... l#msg55905

for a method to have multiple DIV's inside the header.

Ronny