Задачи по верстке
Внимательно прочитай условие)
Должно быть наоборот, кнопка на которую наводишь остается, а другие исчезают
Вот так? -
Хотел похвалить, но нет
В твоем варианте, если курсор попадает в контейнер, например между кнопками, то все кнопки исчезают, а в моем примере я свободно вожу курсором по контейнеру и между кнопками специально, чтобы показать этот момент, так что пока не решено
I want to participate but is hard to understand russian))
The css to do this would be the use of :has and ~
:has To select the previous siblings:
~ To select the next siblings:
The css to do this would be the use of :has and ~
:has To select the previous siblings:
span:has(~ span:is
opacity: 0;
}
~ To select the next siblings:
Amazing
Task:
There are 2 buttons, when we hover the cursor over one of them, the second disappears.
The task needs to be solved only using HTML and CSS
without using javascript
Yes, this is a good solution.
Try to solve this without using the pseudo-classes :is() and :has()
You can solve this using only one pseudo-class :hover. Then it will be more cross-browser
Task:
There are 2 buttons, when we hover the cursor over one of them, the second disappears.
The task needs to be solved only using HTML and CSS
without using javascript
Yes, this is a good solution.
Try to solve this without using the pseudo-classes :is() and :has()
You can solve this using only one pseudo-class :hover. Then it will be more cross-browser
Oh, :has is supported by all major browsers, but this can also be made with * but I don't know if I would use it instead of :has
It doesn't work
90%. That's quite enough, I don't argue
Your decision is good, I agree with that.
This is a task for practice and has more than one solution.
I just saw now how wrong it is lol
I remember reading an article about * when you recommended me not to use it, it should be possible to do something like this, I don't remember how
I do not give unnecessary information so as not to limit the possible number of solutions. This will allow us to find a lot more solutions than I know.
I just saw now how wrong it is lol
I remember reading an article about * when you recommended me not to use it, it should be possible to do something like this, I don't remember how
I made a work around on Steve Dogs solution
I just set pointer-event: none; for the parent and 'all' for the childs, this way the parent will only trigger :hover when the button is selected.
This is a good and simple solution!
It won't, as I explained, the :hover of the parent will be trigged only when the button is selected, you can play around on codepen and set a normal width to the button.
Кидай в codepen посмотрим
Решение, Solution
