I created a random quote generater webpage as part of the freecodecamp curriculum and am now uploading the files to github so that they can be hosted on there as their own webpages. The page works fine in codepen but the 'buttons' don't work when I upload the page to github. I can't figure out why. I would appreciate any feedback and insight on this issue! (I'm quite new to web development and coding in general so I apologize in advance if this is a stupid/simple error) Thanks!
I'm also not sure why the font size is so small on the github version :/
page on codepen - https://codepen.io/armte312/pen/Qrvyjr
github webpage - https://armte.github.io/quotegen.github.io/
github repo - https://github.com/armte/quotegen.github.io
code with issue:
<div class="button-row" id="button-row">
<a class="button tweet-quote" href="#" id="tweet-quote"><i class="fab fa-twitter-square"></i></a>
<a class="button new-quote-btn" href="#" id="new-quote-btn">New Quote</a>
</div><!--End of button-row !-->
I tried using the z-index property because I wasn't sure if some other element may be 'in front of' the a tags but that didn't seem to work. Also tried a more updated version of bootstrap but that didn't seem to matter either.
The 'new quote' button (an tag) should react to the cursor hovering above it and when it's clicked but it does neither...
You have your jquery set as
<script type="text/javascript" src="jquery-3.3.1.js"></script>
while you don't have that name of a file in your github repo. Use this code instead
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
Remove the duplicate
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">