Почему флекс срабатывает на второй тег(а), если я поставил .unn>a, для первого, что с этим делать?

Question

[Антон Вебсайтовский]

Всем привет.
Вопрос простой и тупой, но я походу заработался.
Есть блок, в нем два тега (а), я на первый поставил флекс, .unn>a, а у меня срабатывает и на второй.
Из-за этого у меня уезжает блок весь.

Как это исключить?

Рабочая схема тут.
https://codepen.io/AXOT/pen/rNKdppQ

Comments

[Ankhena]

Первый это :first-child
> - это первый уровень вложенности

[Антон Вебсайтовский]

Ankhena, в том и дело, - это первый уровень вложенности, но почему он проскакивает, и затрагивает второй.

[Антон Вебсайтовский]

Кстати, Первый это :first-child, можно было, но там блоки идут, не подойдет, в блока есть второй тег (a), в диве.

[Ankhena]

Антон Вебсайтовский, эм.. это.. ссылки нельзя вкладывать в ссылки.
Можно открыть инспектор и посмотреть по дереву где он их нарисует.
Если что, в разных браузерах результат может быть разный. Как и обычно бывает с невалидным кодом.

[Антон Вебсайтовский]

Ankhena, ну как бы так выходит, что на весь блок можно нажать, а там еще будет кнопка которая ведет куда-то, смысл такой, как мне для второй (a) скинуть дисплей флекс, пробовал немного методов и пока ничего.

[Ankhena]

Антон Вебсайтовский, значит, кого-то из них нужно делать вторым слоем.
При текущей разметке будет выходить лажа.
Ни ссылки ни кнопки нельзя вкладывать в ссылки.

[Антон Вебсайтовский]

А если там ul li потом а, тож нельзя.

[Антон Вебсайтовский]

Ankhena, ну на эту разметку как бы пофиг, есть ошибка или нет, тем более такого рода, это же фигня.
Ладно придется сделать менее удобно, не весь блок ссылкой, хотя я бы оставил, просто на второй тег (а), мне бы флекс отменить и все, а то он срабатывает и мешает.
Я так помню делал, тег а, внутри него, попут всплывающий и там типа ведущая ссылка, текст, но для данного варианта не очень подойдет, там как бы подменю с вариантами ссылок.

[Ankhena]

Антон Вебсайтовский,

ну на эту разметку как бы пофиг, есть ошибка или нет, тем более такого рода, это же фигня.

Браузер вынимает ссылку из ссылки. Поэтому обе оказываются на первом уровне div > a

[Антон Вебсайтовский]

Ankhena, кстати, ну как вариант, точно. идея хорошая, а то я уже смерился и решил просто u5 сделать ссылкой на подробное, а не на весь блок. Правда все сломалось ), надо чуть переделывать.

[Антон Вебсайтовский]

Странно, сделал как у тебя в примере, потом добавил .unn>div>a:first-child,, или просто .unn>div>a, все равно флексы срабатывают и на тег (а) который идет в u4.

[Антон Вебсайтовский]

Так ну вроде что-то вышло: https://codepen.io/AXOT/pen/rNKdppQ

[Ankhena]

Антон Вебсайтовский, это не у меня в примере... Это скрин девтулзов того невалидного кода.

[Антон Вебсайтовский]

Ankhena, я что-то подобное сделал, правда пришлось всеж лишние дивы добавить, чтобы поделить части первую и вторую. чтоб все по феншуй было.

[Одиночка Айс]

Антон Вебсайтовский,

чтоб все по феншуй было

Ссылка в ссылке... рукалицо

[Антон Вебсайтовский]

Одиночка Айс, не по феншуй я переделал.

Answer 1

[Марат]

.unn>a - этот селектр навешивает стиль на все вложенные тэги a
Если нужно только на первый пиши
.unn>a:first-child

Comments

[Антон Вебсайтовский]

да там так не пойдет, там блоки идут, которые обернути в тег (а), и у каждого блока внутри еще тег (а) есть. кнопка.

[strelok011]

Уважаемый, несколько вопросов
- а зачем вы ссылку в ссылку вкладываете?
- зачем стили писать через такие неудобные селекторы, когда значительно выгоднее писать классы? Это не только удобнее, моднее и красивше, но даже браузер быстрее будет обрабатывать (хоть сейчас это и не важно по быстродействию)
з.ы. в примере я так и не понял что требуется сделать и какая связь с вашим вопросом.

[Антон Вебсайтовский]

strelok011, удобно можно и красиво ), мне удобно меньше пихать классы там где они не нужны и можно сделать проще. пример изменился, я уже сделал.

[Ankhena]

strelok011, можете даже не начинать, тут бесполезно. Я уже раз десять лет за 5 пыталась. Не работает )))
Ссылки в ссылки, селекторы через ж, классы вырвиглаз... всё так и остается.

[strelok011]

Антон Вебсайтовский, печаль беда с этим "мне удобно" конечно... Тогда успехов! :)