HTML + CSS + GRID

Community feedback

• 

  Alexandru•330

  @WardinulPosted over 2 years ago

  Hello @nyakita!

  I will try to give you some helpful points for you here.

  CSS is not working at full screen window. If you go to your preview site you will see that the styles are not working on full desktop screen size, that is because of your media query. Delete the second media query that surrounds the styles of the content (without deleting the styles) and you will see that the styles will appear on the full desktop screen size.

  When you make a site, first try to style the page without media query for one device (desktop/mobile) and only then use media query for the changes you need to do to fit the other device.

  Now another problem that I noticed is the background image. When you start a challenge you are given some design images, and some backgrounds/icons you need to work with. On the background-image you need to link the backgorund image from the folder images. You can do that like so background-image:url(images/bg-desktop.svg); After that you will need to set a background-size:cover; and a background-repeat:no-repeat;

  Another thing now is the height of your body, it is too big. How to solve that is to set it to a height of 100vh.

  Now i will give you a link where you will be learning a better and easy method in grid, and with that you can arrange your content inside of a page much more easly. The video

  Another video that explains really good the grid is this

  Your choice on what method you want to use for the grid templates. I hope I gave you some good informations and hope that these videos will be helpful for you!

  Keep coding!

  Marked as helpful

  1
• 

  ...•600

  @HatimHJPosted over 2 years ago

  for the button try use [button:hover] insted of [button:active]

  for the grid try this site [ https://cssgridgarden.com/ ] great for learning css grid

  if you find this helpfully please mark as helpfull

  Marked as helpful

  1