Hi all, brand new here on Codecademy Forums. My name is Bryan, and I am learning Web Design. I have been learning HTML and CSS to start, and utilizing the workspace feature to practice the skills I have learned before taking more courses. Things are going very well, and have been finding images to use from Wikipedia as a workaround until I become more of an actual Web Designer working with tools locally. I am learning how to do the pull quote feature in HTML/CSS, which I am figuring out here, and just need to add the image in the background for the quotation marks to finalize things and make it more of an actual pull quote with some design and style. Does anyone know of what are some good images or websites that can be used as a workaround to just get an image of some quotation marks that could work for uploading to my Codecademy workspace? I have heard that uploading an image here might work, and then still may work after deleting the post, but since this post might be helpful to others trying to learn how to do this, maybe this one could stay posted? I can try to figure out uploading it from here and let you know if it works or not, but wanted to see if there was another way or place for how to do this? Thanks in advance for reading this, and for your help! I’m enjoying the coding experience! Here’s an image I’m going to try right now and I will let you know if it works. Stay tuned!
Looks like it worked! I attached the image from my workspace, and
here’s some code I have for the HTML:
1st paragraph here
last paragraph here
and my CSS styling:
.pquote {
width: 325px;
float: right;
border: 3px solid #333;
margin: 10px;
padding: 25px;
text-align: center;
}
blockquote {
margin: 0;
padding: 30px;
font-size: 19px;
background-repeat: no-repeat, no-repeat;
background-image: url(https://global.discourse-cdn.com/codecademy/original/5X/c/9/2/f/c92fc7bb996d785211d29fd73275120bf2d3d82e.png),url(https://global.discourse-cdn.com/codecademy/original/5X/c/9/2/f/c92fc7bb996d785211d29fd73275120bf2d3d82e.png);
background-position: 225px 140px, -178px -35px;
}
I have been finding there are different ways to do a pull quote from what I have been reading, but always looking to find better ways or more efficient ways of writing the code, but I at least got it to work, and perhaps this can be a post for others to try out for practice too. I also just used Microsoft Word to type out the quotation marks, then I took a screenshot of the quotes, and then uploading the image in the post here, and then selected to open the .png image up in a new tab, then I copied and pasted the url of the image into my url section in my CSS shown above and it worked! Always looking for other places or ways to do images also, so please let me know if you have other methods or places/sites, etc. that are useful, thanks!