Full version not perfect made using css and flexbox

Community feedback

• 

  SrHatcher•710

  @SrHatcherPosted about 2 years ago

  Hello Karthikeya!

  You are making a great work. don't worry if you struggle making projects. When you struggle it means that you're going the right way to be better in the future!

  Personally i used this setting to make the blue background when you hover the image: Background-color: hsla(178, 100%, 50%, 0.5), you could try it. hsla allows you to use oppaticy in your colors at the final setting: 0.5.

  To use the fonts for the project you can get them from google fonts, i've seen that every project on frontendmentor uses google fonts for the font-family. if you don't know how to use google fonts yet you can watch this tutorial: https://www.youtube.com/watch?v=qgmLDPLApBY

  You can use this CSS rule to make the project more inmersive: cursor: pointer, so that when you put the mouse on something that is supposed to be some kind of link the cursor of the mouse will change to a pointer icon.

  I couldn't understand your third point: I was not able to link the three hover items so that.... if you'd like to explain it again maybe i can help you.

  Marked as helpful

  0

  ---

  

  karthikeya pvs•190

  @karthik5860Posted about 2 years ago

  @SrHatcher i wanted to link three hover items so that the image will change color even if I hover over name and title

  1

  

  SrHatcher•710

  @SrHatcherPosted about 2 years ago

  @karthik5860 oh i see, i can't think in a way to do that without using Javascript. I would add a addEventListener("mouseover", activateAllHoversFunction) to know when the cursor is over the element that i want to trigger all hovers. In the activateAllHoversFunction i'll add the code to manipulate the desire elements in my DOM and active the hover classes (when i say active the hover classes i'm saying that i would add a class to those elements, not active the :hover pseudoclass exactly). Sorry if it's hard to understand, i'm not very good at explaining JS code. Hoping you find it useful :)

  Marked as helpful

  0