• brittanie

    (@brittanie)


    This site I’m working on looks great in Explorer, Safari and Firefox on the Mac, but I’m having a user report an error at the top of the page and that the blog title is overlapping the header picture. Can anyone duplicate? Or report any other issues. Theme is Kubrick all-sidebar with a fancy header.

    Thanks in advance. I owe you a beer.

Viewing 9 replies - 1 through 9 (of 9 total)
  • 800×600 firefox 1.5.0.2 mac title is outside the header to the right giving me a horizontal scroll bar.

    Thread Starter brittanie

    (@brittanie)

    Odd, because he’s seeing the word “Go” on the roof of the house, meaning it would be in the opposite direction of what you’re seeing. Can you help me with my CSS?

    pcmt

    (@pcmt)

    The error is that the blog title is positioned with position:absolute – this is not correct in this instance (unless its container is made position:relative). Try controlling the position of the title with something like (in the stylesheet):

    h1, h1 a, h1 a:hover, h1 a:visited, .description {
    text-decoration: none;
    color: #1f1f1f;
    padding-left: 200px; /* or whatever suits */
    height: 25px;
    }

    Thread Starter brittanie

    (@brittanie)

    Okay, well that works sort of but why can’t I get the padding to work on the top and bottom? I only have a very elementary understanding of CSS…

    pcmt

    (@pcmt)

    I don’t think you need the negative left margin. Anyway, try:

    h1, h1 a, h1 a:hover, h1 a:visited {
    text-decoration: none;
    color: #1f1f1f;
    padding: 0 0 0 180px; /* adjust as required */
    margin: 0;
    }

    You don’t have a description, so I’ve removed it. The padding is set in the order “top right bottom left” (0 0 0 180px).

    Thread Starter brittanie

    (@brittanie)

    Sorry, I’ve been fiddling with it as I wait for you to respond — the negative margin is not there (it doesn’t do anything anyway) anymore, but even if I change your above code to:

    h1, h1 a, h1 a:hover, h1 a:visited {
    text-decoration: none;
    color: #1f1f1f;
    padding: 0 0 100px 180px; /* adjust as required */
    margin: 0;
    }

    the title still does not change position, which I don’t understand why it would move left and right but not up or down.

    pcmt

    (@pcmt)

    Well, lower down in the stylesheet is:

    /* Begin Headers */
    h1 {
    padding-top: 70px;
    margin: 0;
    }

    This is over-riding the h1 settings higher up in the stylesheet. So I would delete the lower one and set the padding in the first one. This should work.

    Thread Starter brittanie

    (@brittanie)

    thank you, takk, merci, kansamnida, gracias!
    (it worked, obviously)

    pcmt

    (@pcmt)

    No problem! I do think Kubrick and Kubrick-type themes would benefit from some simplification, in styling terms. The same appearance can be achieved much more simply, and the default stylesheet can be quite confusing.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Browser check’ is closed to new replies.