Hey everyone! I feel kind of silly for asking this (and yes I’ve looked at the suggested ‘similar topics’ and I can’t find anyone else with the same issue so I guess that makes me uniquely stupid!
Self-bashing aside, here is my actual problem:
Trying to complete the first project on codepen to create a tribute page, and while trying to create a thumbnail with a caption - which should be simple - my image just appears with text underneath it and neither elements are nested within a thumbnail box…
& Yes I have imported bootstrap in codepen… so can you tell me what’s wrong with my code please?
<body> <div class="jumbotron"> <h1>John Conway's Game of Life</h1> <h3>- a tribute page</h3> <div class="thumbnail"> <a href=""> <img src="https://ih1.redbubble.net/image.200241973.9757/flat,1000x1000,075,f.u4.jpg" alt="Glider" style="width:100%"> <div class="caption"> <p>The Glider - a symbol associated with hacker culture which morphs into more complex patterns when the Game Of Life's constraints are iteratively applied.<p></div> </a> </div> </div> </body>
I’ve been reading through the documentation and I managed to get the thumbnail box surrounding the image by itself by giving it the class
img-thumbnail but that still leaves the text underneath outside of that box.
PS: this is my first post on here, so hello there! I’m a n00b but I really love this community and hope to become more active within it! peace!