I’m starting to get very frustrated with my Portfolio page. Every time I finish one aspect of it, I move on to positioning the next element, and the whole page gets thrown off. I feel like I’m doing the whole thing wrong at this point.
It seems like the part I might not be picking up is the grid system?
I know that for the first exercise(tribute page), it was easier for me to just use custom CSS than it was to make it work with bootstrap.(when it came to positioning elements)
Here are some of my concerns:
-
For one thing- should I be using Bootstrap 3 or 4? At first I started using 3 and then when I changed to 4, it threw everything off.
Now that I got the page looking close to how I want with 3, I go to check out how the page looks on my cell phone, and it looks just like it did on my desktop with Bootstrap 4! Grrr -
Everyone’s portfolio has a fixed Navbar. I tried adding one to mine, but when it try to set it’s position to “fixed”, the right side gets cut off instead of spanning the whole page, and the entire page is getting thrown off center, slightly to the right. I tried all kinds of stuff to get the elements on the page to re-center and nothing changes any of it.
-
I was able to space out my P elements and my img elements vertically and horizontally using “display: inline-block” and “margin:…” on the style sheet, to get them where I wanted them on the page. I tried doing the same with my btn elements and instead of spacing out the area around the element, it instead made the buttons themselves a different size, yet left them in the same spot. How can I change the position of the “contact me” button?
-
This kind of relates to my first concern. the page looks pretty good on my desktop, but when I view it on my cell phone, everything is all jumbled up. Most notably is my navbar. I want everything to fit onto a single line, evenly spaced and centered… whether it’s viewed on a desktop or cell phone. Even if it had to stack some elements- I might be okay with that, but stacked neatly, not all random looking…
I even tried repeating the whole bootstrap lesson, but it still didn’t help.
Anyways thanks for taking the time to read and sorry if it’s a lot at once, I just am running into one thing after another. Here is the link:
https://codepen.io/VinnyVincent/pen/mMBdxx
One more thing while I have your attention; Please tell me that I at least got the tribute page right and didn’t totally somehow make it look right while doing the code completely wrong/inefficiently:
https://codepen.io/VinnyVincent/pen/JyrPgY
Any type of feedback at all is very welcome, even harsh criticism.