SitePoint Sponsor

User Tag List

Results 1 to 11 of 11

Thread: css question

  1. #1
    SitePoint Zealot
    Join Date
    Dec 2010
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    css question

    Hi guys,

    I installed a hellobar on my site by installing the following code in the header:

    Code:
    <script type="text/javascript" src="//www.hellobar.com/hellobar.js"></script>
    <script type="text/javascript">
        new HelloBar(38896,52291);
    </script>
    I have some CSS in my theme that is adding a text shadow to the link in the hellobar.

    Code:
    body {background: #E7E9EB url("images/header_bg.jpg") no-repeat center top; text-align: center; line-height: 21px; font-family: Arial, Verdana, sans-serif; font-size: 13px; color: #434343; text-shadow: 1px 1px 1px #fff; min-height: 25px; }
    How can I remove this using CSS? I don't want to lose the text shadow on the rest of the site. Thanks

  2. #2
    Just Blow It bronze trophy
    DaveMaxwell's Avatar
    Join Date
    Nov 1999
    Location
    Mechanicsburg, PA
    Posts
    7,263
    Mentioned
    115 Post(s)
    Tagged
    1 Thread(s)
    Putting aside that I despise those bars.....all you should need would be something like #hellobar-pusher { text-shadow: 0px; }

    (you might need 0px 0px 0px, but I don't think you will....)
    Dave Maxwell - Manage Your Site Team Leader
    My favorite YouTube Video! | Star Wars, Dr Suess Style
    Learn how to be ready for The Forums' Move to Discourse

  3. #3
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,938
    Mentioned
    214 Post(s)
    Tagged
    12 Thread(s)
    Hi there,

    Just adding "text-shadow:none;" to your "hellobar-container" div should work.

    Code CSS:
    #hellobar-container {
      text-shadow: none;
    }

  4. #4
    SitePoint Zealot
    Join Date
    Dec 2010
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by DaveMaxwell View Post
    Putting aside that I despise those bars.....
    Haha, why? From a design standpoint?

    Ok so here is what I have and it doesnt seem to be working.

    html:

    Code:
    <div id="hellobar-container">
    <script type="text/javascript" src="//www.hellobar.com/hellobar.js"></script>
    <script type="text/javascript">
        new HelloBar(38896,52291);
    </script> 
    </div>
    CSS:

    Code:
    #hellobar-container {
    
      text-shadow: none;
    }

  5. #5
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,938
    Mentioned
    214 Post(s)
    Tagged
    12 Thread(s)
    Oh, ok!
    Did Dave Maxwell's solution work?

  6. #6
    SitePoint Zealot
    Join Date
    Dec 2010
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not the way I have tried it. Could there be an issue with having a div that only contains JS? Sorry - I am new

  7. #7
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,938
    Mentioned
    214 Post(s)
    Tagged
    12 Thread(s)
    No probs.
    We are talking about the same text shadow, aren't we?
    The text shadow on the black button ("Watch the Video") is applied elsewhere, namely:

    Code CSS:
    a {
      text-decoration: none;
      color: #262626;
      text-shadow: 1px 1px 1px white;
    }

    If this is what you are trying to get rid of, you will have to do something like
    Code CSS:
    #hellobar-container a{
      text-shadow: 0px;
    }

  8. #8
    Just Blow It bronze trophy
    DaveMaxwell's Avatar
    Join Date
    Nov 1999
    Location
    Mechanicsburg, PA
    Posts
    7,263
    Mentioned
    115 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by awkward_clam View Post
    Haha, why? From a design standpoint?
    Because I find them extremely irritating because it stays there when I scroll the page unless I close it. It's obtrusive (and the one here at the main SP page is worse.....) Add to that all that overhead (did you look at the css that was added for that simple bar?) and I don't see the value in it...

    Quote Originally Posted by awkward_clam View Post
    Ok so here is what I have and it doesnt seem to be working.
    The only place I see the text shadow is on the button. If I inspect the button, this shows as the css which needs the text-shadow:none added to it. You'll need to hunt it in the ugliy css added to the page for it.

    #hellobar-wrapper.hellobar-button-default.hellobar-button.hellobar-dark-images #hellobar-container a.hellobar-cta-link, #hellobar-wrapper.hellobar-button-default.hellobar-button.hellobar-dark-images #hellobar-container a.hellobar-cta-link:link, #hellobar-wrapper.hellobar-button-default.hellobar-button.hellobar-dark-images #hellobar-container a.hellobar-cta-link:visited
    Dave Maxwell - Manage Your Site Team Leader
    My favorite YouTube Video! | Star Wars, Dr Suess Style
    Learn how to be ready for The Forums' Move to Discourse

  9. #9
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,938
    Mentioned
    214 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by DaveMaxwell View Post
    Because I find them extremely irritating because it stays there when I scroll the page unless I close it. It's obtrusive (and the one here at the main SP page is worse.....)
    I agree with you 100% on that.
    I ended up writing a user script for Chrome to block it. I could let you know how, if you like.
    Off Topic:

    BTW, how do I put an off-topic box around this??

    - put [ ot ] [ /ot ] minus the spaces around the text you want to make off topic...

  10. #10
    SitePoint Zealot
    Join Date
    Dec 2010
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by DaveMaxwell View Post
    Because I find them extremely irritating because it stays there when I scroll the page unless I close it. It's obtrusive (and the one here at the main SP page is worse.....) Add to that all that overhead (did you look at the css that was added for that simple bar?) and I don't see the value in it...
    Ya I understand. The value is that it significantly increases conversions.. Might be worth looking into though on my end if most people find it intrusive.

  11. #11
    SitePoint Zealot
    Join Date
    Dec 2010
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    No probs.
    We are talking about the same text shadow, aren't we?
    The text shadow on the black button ("Watch the Video") is applied elsewhere, namely:

    Code CSS:
    a {
      text-decoration: none;
      color: #262626;
      text-shadow: 1px 1px 1px white;
    }

    If this is what you are trying to get rid of, you will have to do something like
    Code CSS:
    #hellobar-container a{
      text-shadow: 0px;
    }
    Thank you, sir.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •