ThemeShaper Forums » Thematic


Where are these div's?

(5 posts)
  • Started 11 years ago by howdave
  • Latest reply from middlesister
  • This topic is not resolved


  1. howdave

    Here's the thematic css for header:

    /* =Header
    -------------------------------------------------------------- */

    #leaderboard {
    #header {
    #branding {
    background:url(/images/header/branding.gif) no-repeat bottom left;
    background:url(/images/header/subscription.gif) no-repeat bottom right;
    padding:88px 0 44px 0;
    #blog-title {

    The #'s represent div id's - where can I find these div id's? As you can see I have put two background images in the branding section. I want to create a new div within the the div branding sits in so i can have my 2 images in the same space.

    Anyone know where I can find these divs?!


    Posted 11 years ago #
  2. vicky515


    Except for leaderboard... I've never seen that. Are you sure it's in the stock Thematic theme?

    Posted 11 years ago #
  3. add a new div to the header between blog title and blog description.

    function new_div(){ ?>
      <div id="bacon">Wooo bacon is delicious</div>
    <?php }

    you can see the priority order of the header functions:

    i think leaderboard is in one of the child themes.... powerblog maybe?

    Posted 11 years ago #
  4. howdave

    Yes sorry leaderboard is a part of my child theme. Thanks so much for that link to a the priority order helgatheviking, The div I am inserting to the header has several div's with in it for images... I am having a nightmare with it though!

    I have removed the blog title and blog description like so:

    function remove_stuff()
    remove_action('thematic_header','thematic_blogtitle', 3);
    remove_action('thematic_header','thematic_blogdescription', 5);

    and added my own div for my header images like so:

    function add_header_branding () {
    <div id="header_branding">
    <div id="header_logo">
    <img src="../../../../images/new_header/header_logo.png" border="0">
    <div id="header_white">
    <img src="../../../../images/new_header/header_white.png" border="0" />
    <div id="header_sub">
    src=0064"><img src="../../../../images/new_header/header_sub.png" border="0">
    <div id="header_mag">
    <img src="../../../../images/new_header/header_mag.png" border="0" /></div>

    add_action('thematic_header', 'add_header_branding', 4);

    The result in firebug is this:

    <div id="header">
    <div id="branding">
    <div id="header_branding">
    <div id="access">
    <div class="skip-link">
    <div class="menu">

    The div "header" is positioned releative. Then when I position either "branding" absolute that whole div falls below "access" and "main" (below access in the order). And is positioned absolute on top of those elements as if it didn't have a place in my overall structure (as if I hadn't labelled as 4).

    Maybe I should say "header_branding" is posited releative and the four div's I have in it are all positioned absolute.

    Can anyone help!? This problem has taken up soooo much of my time and I have not been able to find the cause.


    Posted 11 years ago #
  5. middlesister

    I am not sure I follow what the problem is that you want solved. How do you want things to be displayed? The code snippet from firebug have unclosed div elements. I guess that is a copy paste error, but it makes is hard to see how the elements are nested. A link would be useful.

    When you position elements absolutely, they will be "taken out" of the order of the document and displayed on top of everything else in the spot that you have given it. This is expected behaviour. If you have several elements positioned absolutely that overlap, you can specify the stacking order with z-index. What do you mean with labelling a div as number 4?

    Posted 11 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.