Support » Themes and Templates » Firefox Sliced off my header! Help!

  • Resolved oseary

    (@oseary)


    I recently added a cool (in my opinion) looking theme to my site: http://www.pesosforpenguins.com, the DFire theme.

    Now, I uploaded it and activated it, and all that goodness… but when I look at it, at 1024×768 res, or any res for that matter–whilst in Firefox–it slices my header, and blanks out my Blog title.

    It doesn’t happen in IE.

    Can someone please help? I am a coding n00b, and just need to know how to fix this… Thanks!!

    EDIT: The theme can be downloaded from HERE:

    http://themes.wordpress.net/download.php?theme=511

    to view the files used. I have not modified anything, except for the footer–and that was after seeing the sliced header.

Viewing 15 replies - 1 through 15 (of 18 total)
  • Not absolute positioning so I don’t think you’ll get zorder to work, but you could try moving your title/btitle div’s to after the menu/tree ones?

    And get rid of one of these background:(s):
    #menu ul li a:hover {
    background: #000;
    -moz-opacity: 0.7;
    color: #FFF;
    border-bottom: #99280A 5px solid;
    text-decoration: none;
    background:
    }

    I would really like to make a post but dont see anywhere on this site to create a new thread, please help.

    “I would really like to make a post but dont see anywhere on this site to create a new thread, please help.”

    You have to be a registered user to post… You can leave a comment on anything you’d like though, just click on any post that says, “no comments.”

    “Not absolute positioning so I don’t think you’ll get zorder to work, but you could try moving your title/btitle div’s to after the menu/tree ones?

    And get rid of one of these background:(s):
    #menu ul li a:hover {
    background: #000;
    -moz-opacity: 0.7;
    color: #FFF;
    border-bottom: #99280A 5px solid;
    text-decoration: none;
    background:
    } “

    I understand the second part (removal of the bg’s) but not the first. I am a coding n00b 🙁 I appreciate all your help (ahead of time thanks)!

    Removal of this:

    “#menu ul li a:hover {
    background: #000;
    -moz-opacity: 0.7;
    color: #FFF;
    border-bottom: #99280A 5px solid;
    text-decoration: none;
    background:
    }

    Did not work.

    I love this theme, and don’t want to ditch it b/c it doesn’t work in FF!

    Moving of the titles didn’t work either.

    EEk!

    In header.php your theme does this (default, after <head></head> stuff):
    <div id="title">
    <div class="btitle"><a href="<?php echo get_settings('home'); ?>/"><?php bloginfo('name'); ?></a></div>
    <div class="stitle"><?php bloginfo('description'); ?></div>
    </div>
    <div id="menu">
    <ul>
    <li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
    <?php wp_list_pages('sort_column=menu_order&depth=1&title_li='); ?>
    </ul>
    </div>
    <div id="tree"></div>
    <div id="content">

    Note the order these are placed/defined on the page. You can try changing the order, but this may play havoc with positioning (which would then have to be corrected by making adjustments to your style.css).

    The other issue did not require removing the whole menu ul li a:hover, just the last, undefined background: .

    Yosemite, thank you for your help… I have yet to get it taken care of, but I will try what you just suggested. What it seems like, is that the image is loading or is “formatted” to be placed in front of my text.

    You can still see the text in the background behind the picture. So, I will try & move a few things around.

    Is that what it looks like to you?

    On a lighter note, my fiance & I were at Yosemite just two weeks ago. 🙂

    Yes, that’s what is happening…

    On a lighter note, my fiance & I were at Yosemite just two weeks ago. 🙂

    Arrrr! Lucky I didn’t see you! I woulda held ya up fer all yewr lewt!

    I am registered and a member.

    How can I kill the upgrade of wp on my site? I cant stand it and it is also killing the memory of my server!

    clevohost, to start a new thread, go to main page, pick a topic/forum at the bottom, then enter new post at bottom.

    Guide here: Guide to using the WordPress Support Forums

    I was able to “remove” the “tree.jpg” line from “loading” in the CSS–like mentioned above with it “floating” above the words. Once I removed that line, the words appeared as normal, but there was no tree. So, the tree is floating above the text, along with the menu.jpg.

    Now here’s the hitch. When I “remove” menu.jpg it causes some (most) of my text to go “blue” like the font size & color has changed.

    Arggh!

    I found out what it was!!!

    My TITLE: Gardner Cole’s Slapdash Jottings of a Virtuoso…

    was too long for the header to support… OR since the text is aligned right, it was causing the image to “collide” or whatever with the text.

    I shortened my title down to “Slapdash Jottings…” and it fixed it. I found another site on the net (in FF) using my same theme, and he didn’t have my issue… but he had a very short title.

    NOW, how do I get my text to align left, so I can have a longer title? lol.

    OKAY;

    I have narrowed down exactly what is causing it. It’s within the “title” section of the css, related to the height and width of the background image.

    I guess it doesn’t allow the text to just show on top of it, I guess it’s aligned WITH the text or something.

    I don’t know, but I narrowed it to that.

    If anyone can tell me how to fix it, i’d be much obliged, but for now I changed the title of my blog to something to allow it to fit in the restricted area.

    Help?

    What about changing the #title width:?

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Firefox Sliced off my header! Help!’ is closed to new replies.