Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: niechany bolder wokół tekstu w submenu
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
Mayteck
Proszę efekt jest taki:



A pragnąłbym aby tych ramek nie było, a jedynie, pomiędzy pozycjami pozioma kreska na 1 px.

Oto kod:

.dj-main li.hover {
position: relative;
z-index: 200;
}

.dj-main li.hover ul.dj-submenu {
left: 2px;
top: 70px;
background: #3562BD;
margin: 3px !important;
padding: 3px !important;
/*border: 1px solid #0b4d97;*/
width: 190px;
height: auto;
z-index: 300;
}

.dj-main li.hover ul.dj-submenu li {
display: block;
height: 65px;
position: relative;
float: left;
width: auto;
font-weight: normal;
}

.dj-main li.hover ul.dj-submenu li a {
display: block;
font-size: 18px;
height: auto;
width: 183px;
line-height: 18px;
color: #fff;
text-decoration: none;
/*border: 1px solid #50b5d0;*/
padding-left: 5px;
}

.dj-main li ul.dj-submenu li a.dj-more {
background: #3562BD url(../images/arrow.gif) auto;
}

.dj-main li.hover ul.dj-submenu li a:hover, .dj-main li ul.dj-submenu li a.active, .dj-main li ul.dj-submenu li li a.active, .dj-main li ul.dj-submenu li li li a.active {
background: #DE0D11;
color: #fff;
/*border-color: #fff;*/
}

.dj-main li.hover ul.dj-submenu li a.dj-more:hover {
background: #3f96a9 url(../images/arrow_over.gif) 180px 6px no-repeat;
color: #fff;
}

.dj-main li.hover ul.dj-submenu li a.dj-more-active {
background: #3f96a9 url(../images/arrow_over.gif) 180px 6px no-repeat;
color: #fff;
}

.dj-main li.hover ul.dj-submenu li a.dj-more-active:hover {
/*border-color: #fff;*/
background: #3f96a9 url(../images/arrow_over.gif) 180px 6px no-repeat;
}

.dj-main li.hover li.hover ul, .dj-main li.hover li.hover li.hover ul, .dj-main li.hover li.hover li.hover li.hover ul, .dj-main li.hover li.hover li.hover li.hover li.hover ul {
left: 190px;
top: -4px;
background: #50b5d0;
padding: 3px;
/*border: 1px solid #0b4d97;*/
white-space: nowrap;
width: 190px;
z-index: 400;
height: auto;
}

.dj-main ul, .dj-main li.hover ul ul, .dj-main li.hover li.hover ul ul, .dj-main li.hover li.hover li.hover ul ul, .dj-main li.hover li.hover li.hover li.hover ul ul {
position: center;
left: -9999px;
top: -9999px;
width: 0;
height: 0;
margin: 0 !important;
padding: 0 !important;
list-style: none;
}

.dj-main li.hover li.hover a.dj-more, .dj-main li.hover li.hover li.hover a.dj-more, .dj-main li.hover li.hover li.hover li.hover a.dj-more, .dj-main li.hover li.hover li.hover li.hover li.hover a.dj-more {
background: #3f96a9 url(../images/arrow_over.gif) 180px 6px no-repeat;
color: #fff;
/*border-color: #fff;*/
}

.dj-main li.hover li.hover li a.dj-more, .dj-main li.hover li.hover li.hover li a.dj-more, .dj-main li.hover li.hover li.hover li.hover li a.dj-more {
background: #50b5d0 url(../images/arrow.gif) 180px 6px no-repeat;
color: #000;
/*border-color: #50b5d0;*/
}


Mózg mi wypływa oczami. Jak to zrobić? Domyślam się, że kod jest brzydki bowiem to moje początki z phpem.
nospor
1) uzywaj BBCODE dla wstawianych kodow
2) Dobrze by bylo jakbys wrzucil kod css i html np tu:
https://jsfiddle.net/
to bedzie mozna na zywo zobaczyc i poprawic.
Mayteck
Super, dziękuję, zrobię to jutro z rana, bo to zadanie w pracy, nie mam tu dostępu do plików. Dziekuje!


Cytat(nospor @ 27.04.2016, 14:57:05 ) *
2) Dobrze by bylo jakbys wrzucil kod css i html np tu:
https://jsfiddle.net/
to bedzie mozna na zywo zobaczyc i poprawic.

Dzień dobry,
Nie wiem czy dobrze zrobiłem, używam tego pierwszy raz w życiu:
https://jsfiddle.net/dwdxyju8/

Dziękuję za próby pomocy.
nospor
Brakuje kodu html. Prosilem o dzialajacy kod, ktory bedzie mozna przetestowac. Bez kodu html raczej trudno bedzie to zrobic wink.gif
Mayteck
Eh... No dobrze. Przyznaję, chociaż bardzo mi wstyd - nie wiem, gdzie ten plik .html z kodem znaleźć lub jak go utworzyć(/przekonwertować?).
W katalogu z modułem dj-menu znajduję mnóstwo plików index.html, ale one zawierają jedną ścieżkę.
Czy wybaczysz mi ignorancję i pomożesz w tak, zapewne, banalnej sprawie?
nospor
Nie klikaj POMOGL gdy temat nie jest zakonczony (usunalem).

W pierwszym poscie pokazales nam obrazek. Ten obrazek jest print screenem z tego co jest wygenerowane z kodu html i css jak mniemam. Kod css podales, brakuje kodu html. Nie wiem gdzie znajduje sie ten kod, to ty masz to przed oczami nie ja wink.gif

Najlepiej w przegladarce wcisnij 'Pokaz zrodlo strony' i pobierz kod html stamtad.
Mayteck
*Usunąłem i wrzuciłem ponownie bowiem nie mogę już edytować*
Czy ma wyglądać to tak?

https://jsfiddle.net/mkpn3q5h/

Widzę, że się nieładnie rozsypało, kolejny błąd, którego nie rozumiem. Nie znam tej strony.

Pozwolę sobie przypomnieć:
Proszę o pomoc w 1. Usunięciu ramek, 2. wyśrodkowaniu tekstu w pionie komórki (każdy napis jest w komórce, chciałbym aby był w idealnym środku pola - poznałem polecenie vertical-align, ale nie umiem go zastosować, próbuję już 3 dni), i po 3. dodanie poziomej linii pomiędzy komórkami.

Jeszcze raz dziękuję za wszelkie próby pomocy.

Mateusz.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2024 Invision Power Services, Inc.