Stuck on the task making my webpage images and headers align

1

Hi , there I wondered if I could have some help with my portfolio. I trying to align the image and headers but it seems to change the whole layout every time I try. if you could assist that would be great. Thanks. https://codepen.io/Howard81/pen/zwMRzQ

2

First thing’s first, you have to add Bootstrap and jQuery in a way that Codepen will understand:


They way you’ve got it set up now is great for an actual website, but Codepen likes to handle external resources itself.

What do you mean exactly by “align the images and headers”? Right now everything is left-aligned. Do you want them centered?

3

Thanks for the reply. Does that mean I don’t need the links in the head part for Bootstrap, Javascript and CSS? Yes, I would like to align the headings and the image.

4

You actually don’t need the head or body tags at all, or anything you normally put in the head tag. The HTML section should only be the content you’d normally put in between your body tags. All of that stuff should be in the HTML settings panel. Make sure to copy the url in the href attributes you’re already using if you want to use Bootstrap 3.

Here’s the Bootstrap documentation on alignment classes: Redirecting…
If by “yes”, you mean that you want the heading and image centered, then add the text-center class to the sections you want centered. This will also center your image. Try putting it in your div on line 30:

<div class="heading text-center">

Also, move any styles you have inline to your CSS section. Stuff like <img style="border:6px solid #7F899A " .../> will hurt you later. All CSS in your stylesheets. Always. :thumbsup: