Converting Dotted Lines To Straight, Undotted Lines

• 

  westcoastflaneur · Member · Nov 10, 2015 at 5:14 am

  • Copy link
  • Add topic to favorites

  Hi WordPress Fam,

  So if you look at the homepage of my blog, you can see under the heading, “BUMPSOMETUNES,” there’s two dotted lines, and then on every post on the homepage, where it says, “HIP HOP,” that box is also dotted, and my name, “Ngawang” on posts is also a dotted underline, and within posts as well, be it hyperlinks or under my tags within posts where you can see the previous or next post, and those two boxes are also dotted.

  So, I just want to have all these lines there, but undotted.

  Hope I’m making sense.

  Cheers
  Ngawang

  The blog I need help with is: (visible only to logged in users)

• 

  westcoastflaneur · Member · Nov 10, 2015 at 5:21 am

  • Copy link

  And another question, also within my most recent post, you can see all the way at the end of the post, I have included a “Get it on iTunes” badge, but there’s an underline that is leaking outside the badge. And I didn’t have this problem before, how do i stop that extra underline from showing up. thanks

• 

  nizamilputra · Member · Nov 10, 2015 at 5:36 am

  • Copy link

  Hi there,
  Let me try to help you. Please use this css;

  .site-description:before{
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
  }
  .categories-links-index a{
    border: 1px solid #fff;
  }
  .post-grid-content .entry-footer .entry-meta span a,
  .silvio-single-bg .more-entry-meta .entry-meta span a{
        border-bottom: 1px solid #fff;
  }
  #main #infinite-handle span{
        border: 1px solid #393939;
  }
  .entry-summary a,
  .entry-content a,
  a.comment-reply-link,
  .comment-content a{
    border: 1px solid #393939;
  }
  a.more-link, .st-button, button, input[type="submit"],
  input[type="button"],
  input[type="reset"],
  .comment-navigation a,
  .nav-links .nav-previous,
  .nav-links .nav-next{
    border: 1px solid #393939;
  }

  I hope there is no dotted line left :)

• 

  nizamilputra · Member · Nov 10, 2015 at 5:45 am

  • Copy link

  And another question, also within my most recent post, you can see all the way at the end of the post, I have included a “Get it on iTunes” badge, but there’s an underline that is leaking outside the badge. And I didn’t have this problem before, how do i stop that extra underline from showing up. thanks

  Add class “no-border” on the link. Then put this css;

  .no-border{
    border: none !important;
  }

• 

  westcoastflaneur · Member · Nov 10, 2015 at 6:08 am

  • Copy link

  That worked perfectly for everything, but for my hyperlinks within posts, which is now displaying a black enclosed box around the hyperlink. so anything to address that?

• 

  nizamilputra · Member · Nov 10, 2015 at 6:25 am

  • Copy link

  Oops sorry, please update this section:

  .entry-summary a,
  .entry-content a,
  a.comment-reply-link,
  .comment-content a{
    border-bottom: 1px solid #393939;
  }

• 

  westcoastflaneur · Member · Nov 10, 2015 at 6:50 am

  • Copy link

  sweet! and for my iTunes widget, I don’t understand what to do, just copy past the CSS within my HTML post, or in the main blog CSS editor.

  [And for context reasons, that iTunes badge’s html code that I’m inserting within my post is,

• 

  westcoastflaneur · Member · Nov 10, 2015 at 6:50 am

  • Copy link

  *oops iTunes badge I mean

• 

  westcoastflaneur · Member · Nov 10, 2015 at 6:51 am

  • Copy link

• 

  westcoastflaneur · Member · Nov 10, 2015 at 6:52 am

  • Copy link

• 

  westcoastflaneur · Member · Nov 10, 2015 at 6:53 am

  • Copy link

  oh! and I don’t know why, but it won’t let me post the html code in this conversation

• 

  nizamilputra · Member · Nov 10, 2015 at 7:04 am

  • Copy link

  No. Put the css in CSS editor like other CSS. Then go to your post, switch to Text/HTML Mode. Put class no-border to element that want to remove the border. Example:
  <a href="https://geo.itunes.apple.com/us/album/the-incredible-true-story/id1047835834?at=1000l8wa&app=itunes" style="display:inline-block;overflow:hidden;background:url('http://linkmaker.itunes.apple.com/images/badges/en-us/badge_itunes-sm.svg') no-repeat;width:80px;height:15px;" class="no-border"></a>

• 

  westcoastflaneur · Member · Nov 10, 2015 at 7:19 am

  • Copy link

  Thanks man, worked perfectly!

• 

  nizamilputra · Member · Nov 10, 2015 at 7:23 am

  • Copy link

  Yay! Glad to hear that :)

• 

  westcoastflaneur · Member · Nov 10, 2015 at 7:28 am

  • Copy link

  And one last thing, how do i get my hyperlinks within posts to show up as the “dark red color” that shows up when you hover over it, instead of the dull grey that currently shows up.

  I was previously advised to change the link color from the theme itself, but then it changes all the link colors on the blog which is not what I want – only the hyperlink colors within posts is what I want to display as dark red.

• 

  nizamilputra · Member · Nov 10, 2015 at 8:01 am

  • Copy link

  Here is the code to change the link color within the post;

  .entry-content a{
    color: #900000
  }

  And here is the code to change the link color when your pointer over it;

  .entry-content a:hover{
    color: #000000
  }

• 

  westcoastflaneur · Member · Nov 11, 2015 at 7:06 am

  • Copy link

  Great! Thanks a bunch, everything worked out seamlessly.

  Cheers man

• 

  nizamilputra · Member · Nov 11, 2015 at 7:20 am

  • Copy link

  You are welcome