My 2 versions of personal portfolio page so far

My 2 versions of personal portfolio page so far
0

#1

Hi,

I am trying to add pink background on the menu bar on the top, but nothing happens. The colour for the background would be #f29ea8. I wonder why this does not work. I checked one YouTube video to get help to make this, and did like in the example. Could it affect that I don’t have “Header” part? I tought that I don’t need it, because I don’t want to change the default font-family to something else yet.

By the way, what do you think about this? How could I get the contact information part on the same level, so that
"your first name", “your last name”…etc. would be symmetrically on the same vertical level?

You might wonder why I have two versions of my personal portfolio page. I had huge problems getting forward with the first one (the bottom example), so I started a new one.


#2

That’s because you use the British spelling of colour and CSS uses the American one (background-color). You could also try the shorthand form background: #f29ea8


#3

try this to center your contact form

label {
display:block;
margin-top:20px;
letter-spacing:2px;
}


#4

About this:

How could I get the menu bar from the öleft corner to right corner so that it touches both corners?


#5

You need to remove the padding from the sides of the div (and maybe add these to your .nav tag).


#6

How could I get the pink menubar from the left blue corner to the right blue corner?


#7

About this: http://codepen.io/CoderInCodeCamp/pen/yamzao

  1. I wonder why the picture of the ‘tribute for roses’ is not shown.

  2. Edit: how could I get some space between the grey placeholder box and the rose tribute page box? How could I make the rose tribute page box equally large as the grey placeholder box is?


#8

You can do two things.

  1. Removing the BODY tag padding.
  2. Wrap all your content in a parent DIV tag with the class of “container-fluid”.

References:

Bootstrap v3 Containers
http://getbootstrap.com/css/#overview-container

Bootstrap v4 Containers

Container-fluid vs .container