Finished my random quote generator!

Hey you all! I just finished my random quote generator. I am really proud of it, and that project went really smooth. Thanks for looking!

1 Like

While your project looks great on a pc or mac, it does not on a smaller screen device such as an Iphone. See below for what it looks like on an Iphone. You need to think about how you would make your project more responsive. You are using Bootstrap, so it would be fairly easy using certain classes.

Top of screen

Bottom of screen

To fix the quote box issues, consider replacing the width: 50em; in the following with width: 50%; or width: 75%;

.quote-box {
  width: 50em;
  height: 21em;
  border: gray solid;
  border-width: .5em;
  border-radius: 2%;
  margin:  2em auto;

and then replacing the width: 30em; with width: 90%; in the following:

p {
  margin: auto;
  margin-top: 5.5em;
  font-size: 20px;
  font-family: 'Lato', serif;
  width: 30em;

EDIT: Also, the following line is not necessary as the your use of the .html function on the div with id=“quote” two lines later replaces the contents of the div.


Thank you so much! I will definiately make those changes soon