Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20
  1. #1
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Removing a Border

    Hi everyone,

    On my website (www.ironwhisk.com) at the bottom of each post there is a recipe. I am trying to get rid of the dotted border around the recipe. When I am logged into Wordpress, it does not appear there.

    I have tried adding things like

    Code:
    .easyrecipe { border-style: none !important }
    at the bottom of my stylesheet but it doesn't do anything.

    Any help would be very much appreciated.

    Thank you!

    Ilan

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,624
    Thanks
    6
    Thanked 1,001 Times in 974 Posts
    If you were using the developer tools that are most likely built into your browser (or, as Firebug, available as add-on) you would easily see the rule that is adding the border. It’s on line 419:
    Code:
    #content .post, #content .page {
    	padding:0px 0px 0px 0px;
    	margin:0px 0px 25px 0px;
    	border-bottom:1px dotted #4C4C4C;	
    }

  • #3
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Hi,

    Thank you for your response.

    I actually am using the inspect element option on chrome.

    I tried getting rid of that (it's commented out right now) but the border is still there. The dotted line under the post (http://pbrd.co/16rmTls) is all that went away.

    Thanks again.

    Ilan

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,624
    Thanks
    6
    Thanked 1,001 Times in 974 Posts
    I’m not seeing the border you showed.

  • #5
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Does this help? http://pbrd.co/16rrp3a

  • #6
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,624
    Thanks
    6
    Thanked 1,001 Times in 974 Posts
    Ah, sorry, I misunderstood you. You want to get rid of the border around the recipe. (just to be nitpicking: that’s actually a dashed border)

    OK, it’s just as simple but that style is apparently being applied by the plugin or whatever you are using, hence, it’s not in the regular stylesheet but inserted into the page. However, I think you can’t just override it with another style in your stylesheet because these specific styles all have an !important statement (and are inside the HTML document) which gives them almost the highest possible specificity.

    So, you’ll have to find the styles for that “easyrecipe” and edit these directly.

  • #7
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Yeah, that's what I tried at first. The plugin (called EasyRecipe) uses live formatting to change how everything looks. Unfortunately, when I'm logged into Wordpress it shows that there is no border, both in the settings and around the actual recipe. (screenshot: http://pbrd.co/19nD7ur) I can't get rid of something that apparently isn't there in the first place.

  • #8
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,535
    Thanks
    45
    Thanked 259 Times in 256 Posts
    What do you mean by life formatting? Javascript? Because its either CSS or a scripting language, and if its wordpress, that's Javascript (most likely jQuery).

  • #9
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    I think it's jQuery. I just enter numbers into that panel and it shows me how it looks on the site right away.

  • #10
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,535
    Thanks
    45
    Thanked 259 Times in 256 Posts
    Then you always have the option of changing the jQuery like you did the CSS.

  • #11
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    The live formatting already says that there is no border though.

  • #12
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,912
    Thanks
    15
    Thanked 227 Times in 227 Posts
    If it's inline code you have to use javascript to override it. On the very bottom of the page, just above the body closing tag, put a little script that sets the border of that element to what you want.
    Welcome to http://www.myphotowizard.net

    where you can edit images, make a photo calendar, add text to images, and do much more.


    When you know what you're doing it's called Engineering, when you don't know, it's called Research and Development. And you can always charge more for Research and Development.

  • #13
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Sorry, I'm not very familiar with JavaScript. Could you link me to instructions so I can learn how to do this?

  • #14
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,912
    Thanks
    15
    Thanked 227 Times in 227 Posts
    Code:
    <script type="text/javascript">document.getElementById("theelementsid").style.border="0px";</script>
    If needed, add an ID. Put it between script tags.
    Welcome to http://www.myphotowizard.net

    where you can edit images, make a photo calendar, add text to images, and do much more.


    When you know what you're doing it's called Engineering, when you don't know, it's called Research and Development. And you can always charge more for Research and Development.

  • #15
    Regular Coder
    Join Date
    Aug 2012
    Posts
    112
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Sorry, I'm still confused.
    The recipe is under a class called easyrecipe

    I put

    <script type="text/javascript">document.getElementById("easyrecipe").style.border="0px";</script>

    at the bottom of the page. I'm not still not quite sure what script tags you're referencing and how to implement this code.


  •  
    Page 1 of 2 12 LastLast

    Tags for this Thread

    Posting Permissions

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