Stylizacja a w ul > li elementu o dwóch klasach

pytanie zadane 17 października 2019 w HTML i CSS przez vingilot85 Obywatel (1,150 p.)

Witam,
muszę wystylizować link którego styl określony jest w dwóch klasach. Elementem tym jest li (list item) w liście która konstruuje menu. Parę rzeczy już zmieniłem, ale samo łącze linka determinuje wcześniej ustalona definicja a.
Co więcej, całość jest w Joomla, więc custom.css daje mi tylko ograniczone możliwości.

Pytanie brzmi - jakie w CSS wpisać kombo, aby określić atrybuty tego elementu? Z góry dzięki za dopowiedzi

<div class="sp-module-content">
	<ul id="middle menu" class="nav menu">
		::before
			<li class="item-118">
				<a href="/www orla/index.php/kontakt-menu-middle">
					::before
					Zadzwoń: 61 666 666
				</a>
			</li>
			<li class="item-119">...</li>
			<li class="item-120">...</li>
			::after
	</ul>
</div>

.nav.menu > li
{
float:left;
list-style-type:none;
padding:20px;
background-color:#3B4952;
color: red;
}

.nav.menu
{
text-align:center;
margin-left:auto;
margin-right:auto;
border:1px solid #000;
background-color:#3B4952;
width:50%;
color: red;
}

.nav + .menu > ul > li > a         <!-- TU WŁAŚNIE JEST PROBLEM-->
{
color:#fff;
text-decoration:none;
list-style-type:none;
}

2 odpowiedzi

odpowiedź 17 października 2019 przez mordimer Mądrala (5,720 p.)

Najprościej tak :

.sp-module-content .nav li a {

 //twoj kod

}

komentarz 17 października 2019 przez vingilot85 Obywatel (1,150 p.)

Działa, dzięki. Choć nie wiem czemu zadziałały wszystkie atrybuty poza list-style-type i nadal jest arrow.
jest na to może jakiś sposób?

komentarz 17 października 2019 przez mordimer Mądrala (5,720 p.)

Bo tamtym kodem łapiesz link a nie element listy .. To ci złapie te elementy:

.sp-module-content .nav li{
list-style-type: none
}

komentarz 17 października 2019 przez vingilot85 Obywatel (1,150 p.)

Interesujące rzeczy się dzieją po zastosowaniu tego. Wszelkie atrybuty mogę w końcu zmieniać (jak font-size, font-weight), ale list-style-type:none, nadal nie daje rezultatu. Czy pseudoelement ::before nie będzie tu złej roboty robił? Firebug wskazuje, że ten element jest za ten znacznik (arrow) odpowiedzialny. Można go jakoś wykluczyć?

komentarz 17 października 2019 przez vingilot85 Obywatel (1,150 p.)

Zastosowałem :
.sp-module-content .nav li a::before
{
display:none;
}

i wszystko bangla:)
Dzięki za porady!

odpowiedź 17 października 2019 przez pablop76 VIP (123,180 p.)
edycja 17 października 2019 przez pablop76

Dodaj przyrostek klasy modułu i zwiększ specyficzność. Bo jak użyjesz modułu do innego menu to znowu będziesz miał problem.

id="middle menu" czy to jest poprawne id?

komentarz 17 października 2019 przez vingilot85 Obywatel (1,150 p.)

Spróbowałem i mi całość zniknęła. Pewnie przez zmiany, które już w custom.css wprowadziłem. Jak nie uda się z tym z czym teraz kombinuję, wtedy się pobawię z opcją którą proponujesz.
Dzięki!