Insert logo in header? CSS

Discussion in 'HTML' started by Craven Birds, Aug 5, 2004.

  1. Craven Birds

    Craven Birds Guest

    New to CSS.
    Ready for the sarcastic comments <grin>

    I'm trying to figure how I can fit a logo into the head of all my webpage's?
    But I'm stuck.

    The following is already in my stylesheet.

    #header {
    background-color: #ffffff;
    padding-top: 10px;
    padding-bottom: 10px;
    background-image: url(images/page-bg.gif);
    padding-left: 30px;
    background-repeat: repeat;}

    Is there a way of inserting the logo graphic in the header? When the header
    has a repeated graphic already.
    Probably simple, but I can't figure it.

    TIA
    --

    Regards,
    Chris,

    Bird sightings based around 'Craven' Skipton, North Yorks.
    http://www.craven-birds.co.uk/
    Outgoing mail is certified Virus Free. Checked by the Norton auto-updated
    anti-virus system.
    Craven Birds, Aug 5, 2004
    #1
    1. Advertising

  2. Craven Birds

    Dave Patton Guest

    "Craven Birds" <> wrote in
    news::

    > New to CSS.
    > Ready for the sarcastic comments <grin>


    Before you deal with CSS, fix the (X)HTML.
    You are missing the closing tag:
    <grin>;-)</grin>

    --
    Dave Patton
    Canadian Coordinator, Degree Confluence Project
    http://www.confluence.org/
    My website: http://members.shaw.ca/davepatton/
    Dave Patton, Aug 5, 2004
    #2
    1. Advertising

  3. Craven Birds

    Craven Birds Guest

    "Dave Patton" <> wrote in message
    news:Xns953BB8D40A2F2mrzaphoddirectcaold@24.71.223.159...
    > "Craven Birds" <> wrote in
    > news::
    >
    > > New to CSS.
    > > Ready for the sarcastic comments <grin>

    >
    > Before you deal with CSS, fix the (X)HTML.
    > You are missing the closing tag:
    > <grin>;-)</grin>



    Got the sarcasm! Can I have an answer now?
    --

    Regards,
    Chris,

    Bird sightings based around 'Craven' Skipton, North Yorks.
    http://www.craven-birds.co.uk/
    Outgoing mail is certified Virus Free. Checked by the Norton auto-updated
    anti-virus system.
    Craven Birds, Aug 5, 2004
    #3
  4. Craven Birds

    rf Guest

    Craven Birds
    >
    > "Dave Patton" <> wrote in message
    > news:Xns953BB8D40A2F2mrzaphoddirectcaold@24.71.223.159...
    > > "Craven Birds" <> wrote in
    > > news::
    > >
    > > > New to CSS.
    > > > Ready for the sarcastic comments <grin>

    > >
    > > Before you deal with CSS, fix the (X)HTML.
    > > You are missing the closing tag:
    > > <grin>;-)</grin>

    >
    >
    > Got the sarcasm! Can I have an answer now?


    No.
    <grin/>

    Er, no, you can not do that.

    Are you talking about http://www.craven-birds.co.uk/ [1] ?

    If so then you appear to have a div at the top of each page with your
    heading in it [2]. Put the logo in there.

    [1] You have specified font size in ems and have fallen into the IE size
    bug. When I use my settings to change font size then small is microscopic
    and large is cosmically large. To fix this specify font-size: 100% for the
    body element or, in your case, 120%.

    The left hand nav bar overlaps the content (IE6) with larger font sizes. You
    should specify the left margin of the content in ems. Same for the width of
    the nav bar. With larger font sizes the text escapes the box (Mozilla).

    You are missing a URL in your doctype. This puts IE6 at least into quirks
    mode.

    [2] Surely this should be a <h1>.
    rf, Aug 5, 2004
    #4
  5. Craven Birds

    Neal Guest

    On Thu, 5 Aug 2004 00:45:05 +0100, Craven Birds
    <> wrote:

    > New to CSS.
    > Ready for the sarcastic comments <grin>
    >
    > I'm trying to figure how I can fit a logo into the head of all my
    > webpage's?
    > But I'm stuck.
    >
    > The following is already in my stylesheet.
    >
    > #header {
    > background-color: #ffffff;
    > padding-top: 10px;
    > padding-bottom: 10px;
    > background-image: url(images/page-bg.gif);
    > padding-left: 30px;
    > background-repeat: repeat;}
    >
    > Is there a way of inserting the logo graphic in the header? When the
    > header
    > has a repeated graphic already.
    > Probably simple, but I can't figure it.


    Even if you could, people browsing with CSS off or modified by a user
    stylesheet would miss the image even if they have them turned on. CSS
    isn't a good means of adding essential page content.

    Other than doing something like:

    <h1><img src="logo.jpg" height="80" width="300" alt"The Captain's
    Chair"></h1>
    <!-- or whatever the text of the logo is, that goes in the alt value -->

    on every page, you could include it with SSI or PHP if availabe on the
    server. That way you can change the logo, it's alt text and dimensions in
    one place and not on every page.
    Neal, Aug 5, 2004
    #5
  6. Craven Birds

    Craven Birds Guest

    "rf" <rf@.invalid> wrote in message
    news:pwgQc.33785$...
    > Craven Birds
    > >
    > > "Dave Patton" <> wrote in message
    > > news:Xns953BB8D40A2F2mrzaphoddirectcaold@24.71.223.159...
    > > > "Craven Birds" <> wrote in
    > > > news::
    > > >
    > > > > New to CSS.
    > > > > Ready for the sarcastic comments <grin>
    > > >
    > > > Before you deal with CSS, fix the (X)HTML.
    > > > You are missing the closing tag:
    > > > <grin>;-)</grin>

    > >
    > >
    > > Got the sarcasm! Can I have an answer now?

    >
    > No.
    > <grin/>
    >
    > Er, no, you can not do that.
    >
    > Are you talking about http://www.craven-birds.co.uk/ [1] ?


    Yep, decide to 'float' away from floating menus;-)

    > If so then you appear to have a div at the top of each page with your
    > heading in it [2]. Put the logo in there.


    Ok, I did that but found other problems as you have.

    > [1] You have specified font size in ems and have fallen into the IE size
    > bug. When I use my settings to change font size then small is microscopic
    > and large is cosmically large. To fix this specify font-size: 100% for the
    > body element or, in your case, 120%.


    Ok, I'd better read up on the differences! Used ems as I followed a tutorial
    online.

    > The left hand nav bar overlaps the content (IE6) with larger font sizes.

    You
    > should specify the left margin of the content in ems. Same for the width

    of
    > the nav bar. With larger font sizes the text escapes the box (Mozilla).
    >
    > You are missing a URL in your doctype. This puts IE6 at least into quirks
    > mode.
    >
    > [2] Surely this should be a <h1>.



    Thanks, for the input, I'll put your suggestions into practice. I've noticed
    everything jumping about when changing text size etc and window:-(

    Been desperately trying to fix it with tables, defeats the object though
    doesn't it?

    ATB
    --

    Regards,
    Chris,

    Bird sightings based around 'Craven' Skipton, North Yorks.
    http://www.craven-birds.co.uk/
    Outgoing mail is certified Virus Free. Checked by the Norton auto-updated
    anti-virus system.
    Craven Birds, Aug 5, 2004
    #6
  7. Craven Birds

    Craven Birds Guest

    "Neal" <> wrote in message
    news:eek:...
    > On Thu, 5 Aug 2004 00:45:05 +0100, Craven Birds
    > <> wrote:
    >
    > > New to CSS.
    > > Ready for the sarcastic comments <grin>
    > >
    > > I'm trying to figure how I can fit a logo into the head of all my
    > > webpage's?
    > > But I'm stuck.
    > >
    > > The following is already in my stylesheet.
    > >
    > > #header {
    > > background-color: #ffffff;
    > > padding-top: 10px;
    > > padding-bottom: 10px;
    > > background-image: url(images/page-bg.gif);
    > > padding-left: 30px;
    > > background-repeat: repeat;}
    > >
    > > Is there a way of inserting the logo graphic in the header? When the
    > > header
    > > has a repeated graphic already.
    > > Probably simple, but I can't figure it.

    >
    > Even if you could, people browsing with CSS off or modified by a user
    > stylesheet would miss the image even if they have them turned on. CSS
    > isn't a good means of adding essential page content.
    >
    > Other than doing something like:
    >
    > <h1><img src="logo.jpg" height="80" width="300" alt"The Captain's
    > Chair"></h1>
    > <!-- or whatever the text of the logo is, that goes in the alt value -->
    >
    > on every page, you could include it with SSI or PHP if availabe on the
    > server. That way you can change the logo, it's alt text and dimensions in
    > one place and not on every page.


    Cheers, thanks for the info. SSI or PHP? Not conversed with those, takes me
    all my time to sort HTML & CSS out ;-)

    ATB
    --

    Regards,
    Chris,

    Bird sightings based around 'Craven' Skipton, North Yorks.
    http://www.craven-birds.co.uk/
    Outgoing mail is certified Virus Free. Checked by the Norton auto-updated
    anti-virus system.
    Craven Birds, Aug 5, 2004
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Dominic Suter
    Replies:
    1
    Views:
    1,325
    Dominic Suter
    Jun 22, 2005
  2. Maellic
    Replies:
    3
    Views:
    4,308
    Maellic
    Jan 13, 2004
  3. Woody Splawn

    Under Construction logo or icon

    Woody Splawn, May 1, 2004, in forum: ASP .Net
    Replies:
    4
    Views:
    6,554
    companylogos
    Jul 14, 2009
  4. Replies:
    3
    Views:
    681
    dorayme
    Jan 6, 2007
  5. mlt
    Replies:
    2
    Views:
    831
    Jean-Marc Bourguet
    Jan 31, 2009
Loading...

Share This Page