• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

text-decoration: none; nie działa

Object Storage Arubacloud
0 głosów
297 wizyt
pytanie zadane 24 marca 2021 w HTML i CSS przez Nearr Obywatel (1,890 p.)

Nie działa mi text-decoration: none;

Cały czas mam linie pod napisem. 

<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	<title>.io</title>
    <meta name="description" content="" />
    <meta name="keywords" content="io, io games, games, website games, game, bubble game, buggle, circle, eating other players," />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

	<link rel="stylesheet" href="style.css" type="text/css" />
    <link rel="stylesheet" href="Fontello/css/fontello.css" type="text/css" />
    <link href="https://fonts.googleapis.com/css2?family=Lato&family=Ubuntu&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,400;0,500;0,600;1,700&display=swap" rel="stylesheet">
    <script src="https://code.iconify.design/1/1.0.7/iconify.min.js"></script>

</head>

<body onselectstart="return false;">

    <div id="container">
        <div id="main">
            <div id="left"></div>

            <!--MAIN-->
            
            <div id="mid">

                <input type="text" name="area1" maxlength="40" placeholder="Skin URL" />
                <input type="text" name="area2" maxlength="20" placeholder="Nickname" />
                <input type="text" name="area3" maxlength="20" placeholder="Tag" />

                <input type="button" name="buttonplay">
                    <i class="icon-play"></i>
                    <div class="playins">Play</div>
                </button></a>
                
                <input type="button" name="buttonspectate">
                    <i class="icon-eye"></i>
                </button></a>

                <!--RIGHT------>

            </div>
            <div id="right">

                <!--SETTINGS-->

                <div id="settings">
                    <i class="settingsins"></i>
                </div>

                <!--SETTINGS-->

                <div id="profile">

                    <div class="loginins">Login with your Discord account to save your progress in game.</div>

                    <a href="https://discord.gg/76dhzvEFGy" target="_blank">
                        <div id="buttonlogin">
                            <div class="loginbuttonins">Login with your Discord account</div>
                        </div>
                   </a>

                </div>
            </div>
            <div style="clear:both;"></div>
        </div>

             <!--SOCIALS-->

             <div id="socials">
                <a href="https://discord.gg/76dhzvEFGy" target="_blank"><div class="dc">
                    <i class="iconify" data-icon="fa-brands:discord"></i>
                            <a href="https://discord.gg/76dhzvEFGy" target="_blank">
                                <div class="dcsub">
                                    Official Discord
                                </div>
                            </a>
                </a>            
                
                <a href="https://www.youtube.com/channel/UCRjwCE_lmKW2lxToBQso66A" target="_blank"><div class="yt">
                    <i class="icon-youtube-play"></i>
                        <div class="ytsub">
                            <a href="https://www.youtube.com/channel/UCRjwCE_lmKW2lxToBQso66A" target="_blank">
                                <div class="ytsub">
                                    YouTube
                                </div>
                        </div>
                            </a>
                </a>   
                </div>
            </div>

    </div>
</body>
</html>
body {
    background-color: #2e2e2e;
    color: #cecece;
}

#container {
    width: 1700px;
    height: 900px;
    margin-left: auto;
    margin-right: auto;
}

#main {
    width: 1200px;
    height: 580px;
    top: 50%;
    left: 50%;
    transform: translate(20%, 40%);
}

#left {
    float: left;
    width: 380px;
    min-height: 570px;
    background-color: #1d1d1d;
    border: 1px solid #0a0a0a; border-radius: 3px;
    box-shadow: 0px 0px 7px #0a0a0a;
    margin-right: 9px;
    margin-left: 9px;
}

#mid {
    float: left;
    width: 370px;
    min-height: 570px;
    background-color: #1d1d1d;
    border: 1px solid #0a0a0a; border-radius: 3px;
    box-shadow: 0px 0px 7px #0a0a0a;
    margin-right: 9px;
    margin-left: 9px;   
}


#right {
    float: left;
    width: 380px;
    height: 570px;
}

#profile {
    float: left;
    width: 380px;
    min-height: 210px;
    background-color: #1d1d1d;
    border: 1px solid #0a0a0a; border-radius: 3px;
    box-shadow: 0px 0px 7px #0a0a0a;
    margin-right: 9px;
    margin-left: 9px;
    margin-top: 9px;
}

#settings {
    float: left;
    width: 380px;
    min-height: 340px;
    background-color: #1d1d1d;
    border: 1px solid #0a0a0a; border-radius: 3px;
    box-shadow: 0px 0px 7px #0a0a0a;
    margin-right: 9px;
    margin-left: 9px;
    margin-bottom: 9px;
    font-family: 'Josefin Sans', sans-serif;
}

input[name="area1"] { 
    background-color: #272727;
    color: #cecece;
    outline: 1px;
    border: 1px solid #272727;
    border-radius: 3px;
    transform: translate(5%, 1195%);
    width: 324px;
    height: 27px;
    padding: 5px;
}

input[name="area2"] { 
    background-color: #272727;
    color: #cecece;
    outline: 1px;
    border: 1px solid #272727;
    border-radius: 3px;
    transform: translate(8%, 965%);
    width: 192px;
    height: 27px;
    padding: 5px;
}

input[name="area3"] { 
    background-color: #272727;
    color: #cecece;
    outline: 1px;
    border: 1px solid #272727;
    border-radius: 3px;
    transform: translate(20%, 965%);
    width: 108px;
    height: 27px;
    padding: 5px;
}

input[name="buttonplay"] {
    background-color: #272727;
    color: #cecece;
    border: 1px solid #272727;
    border-radius: 3px;
    width: 280px;
    height: 33px;
    text-align: center;
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    transform: translate(6%, 1350%);
    outline: 1px;
    text-decoration: none;
}

.playins {
    width: 0px;
    color: #ffffff;
    text-decoration: none;
    text-shadow: 0px 0px 2px black;
    font-family: 'Ubuntu', sans-serif;
    transform: translate(120%, 2210%);
    margin-left: 153px;
}

.playins:hover {
    background-color: #175cb8;
}

input:hover[name="buttonplay"] {
    background-color: #175cb8;
    box-shadow: 0px 1px 3px #175cb8;
}

input[name="buttonspectate"] {
    background-color: #272727;
    color: #cecece;
    border: 1px solid #272727;
    border-radius: 3px;
    width: 45px;
    height: 33px;
    text-align: center;
    font-family: 'Ubuntu', sans-serif;
    transform: translate(680%, 1130%);
    text-decoration: none;
    outline: 1px;
}

input:hover[name="buttonspectate"] {
    background-color: #d1b006;
    box-shadow: 0px 1px 3px #d1b006;
}

.loginins {
    font-size: 17px;
    margin-left: 15px;
    margin-top: 35px;
    font-weight: 1px;
    text-align: left;
    color: #ffffff;
    text-shadow: 1px 1px 2px black;
    font-family: 'Roboto Mono', monospace;
}

.settingsins {
    font-family: 'Josefin Sans', sans-serif;
}

#buttonlogin {
    background-color: #131313;
    border: 1px solid #000000;

    width: 300px;
    height: 50px;
    border-radius: 8px;
    margin-top: 35px;
    margin-left: 35px;;
    margin-right: auto;
    font-size: 19px;
    font-family: 'Josefin Sans', sans-serif;
}


.loginbuttonins {
    color: #ffffff;
    font-family: 'Josefin Sans', sans-serif;
    color: #ffffff;
    margin-top: 17px;
    margin-left: 10px;
}

#socials {
    margin-bottom: 50px;
    width: 290px;
    min-height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: 50%;
    transform: translate(-100%, 1518%);
    text-decoration: none;
    color: #ffffff;   
}

.dc {
    float: left;
    background-color: #738adb;
    width: 160px;
    height: 34px;
    border-radius: 5px;
    margin-right: 10px;
    box-shadow: 1px 1px 3px #111111;
    text-align: center;
    font-family: 'Josefin Sans', sans-serif;
    margin-top: -5px;
}

.dc:hover {
    background-color: #5e75c2;;
}

.yt {
    float: left;
    background-color: #FF0000;
    width: 120px;
    height: 34px;
    border-radius: 5px;
    box-shadow: 1px 1px 3px #111111;
    font-family: 'Josefin Sans', sans-serif;
    text-decoration: none;
    margin-top: -5px;
}

.yt:hover {
    background-color: #be0202;
}

.iconify {
    font-size: 25px; 
    margin-right: 120px; 
    margin-top: 5px;    
    text-decoration: none;
    color: #ffffff;
    text-shadow: 2px 2px 2px black;
}

.ytsub {
    float: left;
    width: 120px;
    height: 35px;
    border-radius: 5px;
    font-family: 'Josefin Sans', sans-serif;
    margin-top: -10px;
    margin-left: 23px;
    text-decoration: none;
    color: #ffffff;
    text-shadow: 2px 2px 2px black;
}

.dcsub {
    float: left;
    width: 120px;
    height: 35px;
    border-radius: 5px;
    font-family: 'Josefin Sans', sans-serif;
    margin-top: -20px;
    margin-left: 35px;
    text-decoration: none;
    color: #ffffff;
    text-shadow: 1px 1px 2px black;
}

 

2 odpowiedzi

+1 głos
odpowiedź 24 marca 2021 przez Wiciorny Ekspert (270,150 p.)
wybrane 24 marca 2021 przez Nearr
 
Najlepsza

Dekoracja nalezy do elementu LINKU, u Ciebie link nie jest w klasie .loginins , w tym divie sie nie znajduje, więc znajduje się w divie #profile więc możesz dodać stylizacje na seleketor a w #profile :) i problem się rozwiązuje, mozna wiele innych dróg ale pamietaj że dekoracja nadawana jest w elemencie a, po prostu selektory twoje go nie obejmowały 

.loginins , #profile >a {
    font-size: 17px;
    margin-left: 15px;
    margin-top: 35px;
    font-weight: 1px;
    text-align: left;
    color: #ffffff;
    text-shadow: 1px 1px 2px black;
    font-family: 'Roboto Mono', monospace;
     text-decoration: none;
}

 

komentarz 24 marca 2021 przez Nearr Obywatel (1,890 p.)
Dziękuję bardzo :D
komentarz 24 marca 2021 przez Wiciorny Ekspert (270,150 p.)
nie ma za co, napewno da się to inaczej zrobić- tak żeby te pozostałe "właściwości" nie były uwzględniane na linki, możesz po prostu wydzielić do osobnego selektora,
#profile >a   wtedy każdy link którego rodzicem bedzie #profile - chociaz tutaj to bedzie tylko jeden rodzic bo jest to ID- a ono musi byc unikalne - bedzie mialo takie wlasciwosci jakie zapiszesz
0 głosów
odpowiedź 24 marca 2021 przez VBService Ekspert (253,340 p.)

Możesz wszystkie "wyłączyć" podkreslenia.  wink

<a href="#">link 1</a>
<a href="#">link 2</a>
<a href="#" class="underline">link 3</a>
<a href="#">link 4</a>
* {
  text-decoration: none;
}
a.underline {
  text-decoration: underline;
}

 

komentarz 24 marca 2021 przez Nearr Obywatel (1,890 p.)
dziękuję
komentarz 24 marca 2021 przez VBService Ekspert (253,340 p.)

Masz

linia 36 domykanie znacznika </a> bez ówczesnego jego "otwarcia"
linia 40 domykanie znacznika </a> bez ówczesnego jego "otwarcia"
linia 75-80 masz znacznik <a> we wnętrzu znacznika <a>
linia 82-91 masz znacznik <a> we wnętrzu znacznika <a>

<a> - hyperlink
The interactive element <a> must not appear as <a> descendant of the <a> element.

Podobne pytania

+1 głos
2 odpowiedzi 169 wizyt
pytanie zadane 6 kwietnia 2021 w HTML i CSS przez Kufel Nowicjusz (210 p.)
0 głosów
1 odpowiedź 276 wizyt
pytanie zadane 28 grudnia 2016 w HTML i CSS przez szymon567 Początkujący (340 p.)
0 głosów
2 odpowiedzi 1,239 wizyt
pytanie zadane 29 marca 2018 w HTML i CSS przez Liryk Użytkownik (650 p.)

92,574 zapytań

141,423 odpowiedzi

319,648 komentarzy

61,959 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...