I am so perplexed on this one. All I want is a solid white strip at the top of my page, but it looks like this nonsense. The logo is an image only as big as the word Tesla, and the rest of the white is the #header background color. I just want the links to be to the right of the logo, the entire top of the page to be white, and for it to have a fixed position at the top of the screen.
Link: https://codepen.io/kamaljyotwal/pen/vYGNzZG?editors=1100
This is after i made some changes, you are facing most of problems because of pre-applied styles, CSS applies some default styles to items if you don’t specify anything.
To get rid of that in beginning one should set them margin, padding to 0,
you can tweak the code to make color changes etc.
The height of logo is hard coded, so change it if you wish to. but will also need to change padding of 'li' items to match that.
Justify content: space-around and space-between etc. to change how children are spaced out/ sit on the parent container.
Dude, thank you so much! That looks beautiful. The hover is much more aesthetically pleasing than what I was intending . Can’t wait to start working on the page again tomorrow.
1 Like