Trying to get label and text lined up

I had to delete my topic from yesterday because the group wanted to make changes to the html, and somehow the html got worse. I spent the last hour or so trying to fix it so I could at least style something. The css was made by someone else, but then I was asked to make changes to it.

There is the pen I am working with. For some reason they have labels, and then are using p tags to have the following text. I am not sure why we have labels if we are not going to be using inputs, but that is the way then sent it to me. I would like to have all the labels lined up under each other, and then have the text lined up under the other text. I have tried using text-align and some other things to get them to move, but so far I have had no luck.

1st Edit: I just realized there was another text-align css that was stopping the labels from moving left, so the labels are lined up but still need to get the p text lined up

That you want?

I think I am going to change game plans. There were a lot of extra divs in the html for some reason, so I had to get rid of those and re work the css classes. This is what I have now

Which I think is a lot better than the first thing I posted. I will just have to work on the font size and everything now. Not sure the group will be happy I re worked all the html but it was a headache

Who, or what is “the group”?

Are you giving us the complete picture? Have you been given the complete picture?
The html code you provided has quite a few bootstrap classes but there’s nothing that calls in bootstrap.
The css code you provided has over 100 lines of code that has nothing to do with what you’re styling.

It is a school project, and to be honest at this point there was mass confusion going on. The person who originally set up the HTML, and CSS was not very confident in these areas (how he was the one who got picked to do them I have no idea). When I was originally given the HTML and CSS files all I was told was “do what you think looks good.” so, there was no real direction.

The Table was already set up when I got the files, and I decided to leave that alone. The biggest concern was getting everything centered and spaced out. Originally, it was all on the left and both forms had all the text on one line it seemed. Which is why I ended up using flexbox to fix everything, and deleted a lot of their HTML. I just made changes to the code pen, and right now I think that is good as its going to get. Since, it is mainly just text there is not a lot to style.

I just finished making the button animations, and then the only thing left would be to look at some google fonts. Unless, anyone here has some other ideas.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.