My 2 versions of personal portfolio page so far

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.

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

1 Like

try this to center your contact form

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

1 Like

About this:

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

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

1 Like

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

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?

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