I am stuck- please help

HTML-CSS
1

So I am trying to finish this section,
I am working on the last project “Personal Portfolio”
I am using CSS grid as I am not very good at this and tend to copy things,
so I have been taking a different approach to the sample project.
I am stuck on the ‘project title’ classes.
I want them to appear below the images, but not sure how to.
any advice appreciated
here is my code:

https://codepen.io/lukemersh/pen/zYGwyxM

2

also I have notice an error,
it says i should have at least one ‘project-title’ class, which i do, but it has not recognized it, pls help.

1 Like
3

Hi,

As I see you made a div container for all projects and after you put everything to this container. I suggest you to make more containers for every single projects. So your layout will be the following:

layout 
<div id="projects">
    <div id="project1">
    </div>
   <div id="project2">
   </div>
   .... and so on
</div>

And to learn more how to positioning text and images I highly recommend to you take a look to this site: w3schools
More info from grid system

good luck

2 Likes
4

i was going to use bootstrap, but that would be cheating, lol

5

@lendoo why is it saying that i havent done the ‘project-title’ class?
i have several of them.
cheers.

6

Did you try to add class “project-title” to any section element?
Currently you added to p elements…

7

Thats right, I only added it to the

.
So do I have to add it to a section element?

8

You spell it wrong should be project-tile it is not title

1 Like
9

I have another problem, i cant find the answer too…
the ‘project-tile’ I am wanting to display below the image and also the order of them is wrong too.
Any help much appreciated

10

@lendoo i created the other divs like you said , which actually fixed my current issue with the’project-tile’
any ideas how to move the first project inline with the other 2 and then have the last project on a seperate line?
many thanks

11

I just done something that has now messed up my layout, grrr

12 
<section id="projects">
      <div class="project">
        <h1 class="project-title">These are some of my projects</h1>
</section>

The above h1 element is a header, not any project.
Remove from the projects container ( <section id="projects">)
The open body tag move up to below </head>
Your navigation is not any header. Between the header tag replace your h1 element…
A little help to recognise the containers.

13

so i removed the <h1> which worked well thank you,
But do I place that above the section?