Button links in Personal Portfolio Beginning project (please save me from my mounting rage)


#1

I have no idea what the problem is here. Two of these button links that I’ve created are working just fine, but the others won’t work. yet, the addresses in them are correct. I have no idea what the problem is. Please help!! (ps some weird rule only allows me to put 2 links in a time so I can only post 2. There are 5 in my actual page.

<a href="http://www.linkedin.com/in/jeff-suwak-277546124/"><button class="SMI">LinkedIn</button></a>
<a href="http://www.twitter.com/ghostelectrics"><button class="SMI">Twitter</button></a>

#2

I am quite new to coding. Perhaps nesting your a tags within your button tags will do the trick.


#3

Can you share a link to your Codepen of this project?


#4

If you are seeing this issue in CodePen, you need to use target="_blank" in your hyperlinks. That could be one reason for the failure.

Another possible reason: It is invalid HTML to nest a <button> inside of an <a> tag (and vice-versa). The <a> tag cannot contain interactive content like buttons, iframes, videos, input elements, etc. You can style your hyperlinks to look like buttons if that’s the effect you are looking for.

Assuming you’re using bootstrap and want your hyperlinks to look like buttons, use this code:

<a class="btn btn-primary" href="http://www.linkedin.com/in/jeff-suwak-277546124/" target="_blank">LinkedIn</a>
<a class="btn btn-primary" href="http://www.twitter.com/ghostelectrics" target="_blank">Twitter</a>

(and feel free to replace btn btn-primary with your own CSS class to style your links as needed)


#5

Thanks so much for the help everyone. I was able to solve the problem.

rmdawson71, if you were still interested, the link is here: https://codepen.io/jsuwak/pen/OjjwKG

I’m new at this, don’t judge me!

Ha, seriously, if you do happen to look and have any feedback, I’d appreciate it. Still learning this stuff.