Skip to content
OverviewSolutions
5
Comments
3

tomas

@ttoomasCzech Republic150 points

Student of the second year of technical School.

I’m currently learning...

JavaScript, php, mysql

Latest solutions

Latest comments

  • tomas•150
    @ttoomas

    Hi, great job on this site!

    You can center the text next to the logo using the flexbox: .avatar-text {display: flex; align-items: center} align-items

    Otherwise, I recommend trying the following for the background image: Create a parent <button> that will have position: relative. Then create a pseudo-element :: before for this button, which will have content: url ("picture") position: absolute, opacity: 0 and center it with display: flex (picture view) . Then add only <img> to <button>. Then you do button:hover::before and add opacity: 1. I hope my advice helped.

    Marked as helpful
  • tomas•150
    @ttoomas

    Hi. I write in advance, I'm not an expert, I don't know if it's right, but you can try it.

    Create a parent <button> that will have position: relative. Then create a pseudo-element :: before for this button, which will have content: url ("picture") position: absolute, opacity: 0 and center it with display: flex (picture view) . Then add only <img> to <button>. Then you do button:hover::before and add opacity: 1.

    I hope my advice helped!

    Marked as helpful
  • tomas•150
    @ttoomas

    In the last edit, I noticed that when I hover over the text " Jules Wyvern "is not just to change the color of the text, but to add a border around the image. Using a simple Js, I added an" active "class as I hover over the text, which simply adds a border around the image. I was just wondering, could it be done without js, using :hover?