Remove Link Styling on Images in Sidebar

[Kent]

I'm trying to remove the white underline/border of linked images in the sidebar of the Minimum Pro theme and I can't seem to track down the CSS for that. I think I probably need to add some to 'style it out' but i'm not sure where/how to do that. Suggestions? Thanks.

---

Dad. Biker. Designer. | kentfackenthall.com

http://kentfackenthall.com/dw1/bio/#

[David Chu]

Hi,
A modern hipster move is to use borders instead of normal underlined links. Here's a way to pull those out. If you took out the textwidget part it would remove underlines from other sidebar links, too. If you're mixing and matching you may need to be very specific. 🙂

.sidebar .textwidget a {
  border-bottom: 0;
}

Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Kent]

Dave,

Thanks for that. When I put your code in, it does indeed nuke the underlines for my text links as well, which I don't want.

When I try this:

.sidebar .textwidget a img {
  border-bottom: 0;
}

Nothing changes. I'm stumped.

---

Dad. Biker. Designer. | kentfackenthall.com

[jhguynn]

I'm stumped too, but would to know the answer when one comes along. "Bump".

[David Chu]

Specifying IMG will do nothing because it's inside the link that is being styled. This will work, and will leave any other sidebar widget's links alone, but you won't be able to use any other links in that specific widget without killing the dots. Take a look at the HTML to see what's happening.

.sidebar #text-6 a {
  border-bottom: 0;
}

Anything beyond that, you'll probably need to get a developer working on it.

Good luck,
Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Tom]

There is a very good review of options on this page: Pure CSS: Remove Link Properties for Linked Images with Borders ... however, they're not working for me tonight.

Anyone else want to have a look at some of these potential methods?

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[Kent]

Hi everyone, FWIW, I wrote support and got this answer. It worked.

"I would recommend creating a class to use when you don't want a border. Add this to your style.css file."

.noborder {
      border: none;
}

Then, you can use that like this:

<a class="noborder" href="#">stuff</a>

---

Dad. Biker. Designer. | kentfackenthall.com

[jhguynn]

"When the answer is simple, God is talking" Einstein.

[directionsnotincluded]

Thank you! All the other options I've been trying today would not work. This did the trick for me.

[Author]

Posts