My First Quote Machine!

Hey guys! After some revisions I was able to fix up my Random Quote Generator (things were getting funky when you zoomed in/out). Here it is: http://codepen.io/Bosa100/pen/yJwbEE. Hope you guys like it. Feedback/constructive criticism is strongly desired. Thanks in advance for your comments! :smiley:

(ONE MORE THING: When you guys click the link does the quotes appear inside the T.V.? Sometimes when I access my machine the quotes aren’t there :frowning: )

I think this will be pretty difficult because if you set the background-image of the body, the image will not resize when you adjust the width of the screen.

Something that you can TRY is maybe having a containter div and setting the background-image of the DIV to the image and adjusting your image/ text inside the div. Make sure the div has a max-width of 100% or a px size you set so the image will be responsive.

If this works, you probably will then need to use a lot of media queries to adjust the size/location of the text as the image adjusts.

Not 100% this will work but it is worth trying!

1 Like

So I tried what you mentioned, and IT WORKED! :smile: Unfortunately, now everything is out of order, but when I zoom out everything stays together. :slight_smile: Now that I think about it it makes perfect sense that it was the various divs that were causing this issue. THANK YOU SO MUCH! I’ll definitely repost when everything is ready. :+1:

No problem I’m glad that helped :smile:

And yea it’s probably going to be a huge pain to get the sizing right as you resize your browser to smaller screens but hey at least it works lol.

Looking forward to seeing the updated version!

1 Like

Yeah, but it is what it is I suppose xD And thanks! Will definitely keep you posted. :+1: