Need help applying Firebug info

  • I am trying to get rid of the wide, grey subheader strip on my blog:

    https://www.canyoneeringcentral.com/rave/

    When I use Firebug to try to find what code is creating this strip, I see this code:

    <div id=”blog-block-wrap”>
    <div id=”single-block” class=”row”>
    <div id=”single-top” class=”twelve columns”>
    <h1 id=”single-title”>
    Check out the latest action, Jackson.

    <span class=”single-star”>★</span>
    </h1>
    </div>
    </div>

    is responsible for the grey strip, and the text and star within it. This is in the HTML window. When I delete this section of code, my blog looks exactly as I want it to. But I’m confused about where I can actually delete this code on my site. I know how/where to delete/modify CSS, but I don’t know how to edit HTML code. Does the CSS automatically create the HTML code? Is it the CSS that I actually have to edit?

    If anyone could help me understand how to make this edit, I would really appreciate it. My understanding is this is pretty easy stuff when you understand how Firebug works, but I am missing a connection here.

    Thanks,
    Nick

Viewing 7 replies - 1 through 7 (of 7 total)

  • HTML is not generated by CSS — it is generated by the php files – but the CSS code determines how the html elements appear on the page — i.e. styling. But some CSS code CAN control whether an element appears on the page (i.e. display: none; will “hide” the element so it is as if it is not there even though the code is still there.

    I can’t see what you are referring to as a problem. There is no grey strip — maybe you’ve changed it already — though I do see a fairly large gap between the navigation and the content. You should be able to change that using CSS (margin and or padding).

    Thread Starter nawilkes

    (@nawilkes)

    You’re right, WPyogi, I had been messing with things, trying to fix it up, and I had removed the gray strip. But even when I do, the blog-block-wrap thing remains. I undid my mess-about, so you can take a look. Would you, please? I would really appreciate it. I want to figure out how to ID a problem and fix it reliably. I’m getting better, but I’m hitting a block here.

    Thanks!
    Nick

    Okay, no problem — sorry for the delay — been offline today. You can fairly easily get rid of that using the CSS code — just add the bottom line (display: none;) to this CSS declaration (line 134 in style.css)

    #blog-block-wrap {
    background: url("framework/images/bg-info.png") repeat scroll 0 0 transparent;
    border-bottom: 1px solid #E1E1E1;
    border-top: 1px solid #E1E1E1;
margin-bottom: 50px;
    display: none;
}

    Then you can get rid of the remaining gap if you want to by reducing the margin in this one (line 101)

    #loop-block.row {
    margin-top: 30px;
}

    But these change MAY affect other pages — not sure how your other pages are set up or if it matters. So try it out and see if it solves the problems.

    BTW, cool site (both topic and layout, etc.)

    Thread Starter nawilkes

    (@nawilkes)

    WPyogi, I am in your debt. I was hitting my head against the wall pretty hard there. I implemented your suggestions after testing in FireBug, and things look good. Thank you.

    So anytime I want an entire element to disappear, I can use “display: none”? That seems key. I knew the concept I wanted, and I knew the CSS line I wanted to use it on, but didn’t know how to find code language. I had tried all kinds of modifiers as work-arounds, but I just wanted to go away.

    The #loop-block.row line… I don’t think I had run across that while studying the site. I am getting better with FireBug, but I still don’t seem to understand CSS and WP well enough to really rock.

    Thanks again for your help. Would you mind if I asked help of you in the future? Can I do that on this forum?

    And thanks for the compliments on the site. I have been having a lot of fun with it. Sort of an esoteric subject area.

    Nick

    You’re more than welcome. It’s kind of hit and miss as to when I’m on the forums here, so I’ll email you on your contact page, so you can email me directly if you’d like.

    Thread Starter nawilkes

    (@nawilkes)

    Actually, if you could email me at the below site, that would actually make it to my inbox. The other page is a client, thus all emails go to his email address. ??

    https://www.nickwilkesphotography.com

    Thanks! NW

    Yeah, sorry about that. I looked more closely after I posted that and realized that…just sent you an email.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Need help applying Firebug info’ is closed to new replies.