Текстовое оформление: не работает

Полностью сбит с толку! Я попытался переписать строку text-decoration: none несколькими разными способами. Мне также удалось изменить размер текста, настроив его, но код text-decoration: none не займет.

Помогите оценить.

код

.widget    
{
     height: 320px;
     width: 220px;
     background-color: #e6e6e6;
     position: relative;                              
     overflow: hidden;                          
}


.title    
{
     font-family: Georgia, Times New Roman, serif;
     font-size: 12px;
     color: #E6E6E6;
     text-align: center;
     letter-spacing: 1px;
     text-transform: uppercase;
     background-color: #4D4D4D;    
     position: absolute;
     top: 0;
     padding: 5px;
     width: 100%;
     margin-bottom: 1px;
     height: 28px;
     text-decoration: none;
}

a .title    
{
     text-decoration: none;
}
<a href="#">
    <div class="widget">  
        <div class="title">Underlined. Why?</div>  
    </div>
</a>

Ответы

Ответ 1

У вас есть элемент блока (div) внутри встроенного элемента (a). Это работает в HTML 5, но не в HTML 4. Таким образом, только браузеры, которые фактически поддерживают HTML 5.

Когда браузеры сталкиваются с недействительной разметкой, они попытаются ее исправить, но разные браузеры будут делать это по-разному, поэтому результат будет изменяться. Некоторые браузеры будут перемещать элемент блока вне встроенного элемента, некоторые будут игнорировать его.

Ответ 2

a:link{
  text-decoration: none!important;
}

= > Работа со мной:), удачи

Ответ 3

Используйте CSS-псевдоклассы и дайте тегу класс, например:

<a class="noDecoration" href="#">

и добавьте это в таблицу стилей:

.noDecoration, a:link, a:visited {
    text-decoration: none;
}

Ответ 4

Добавьте этот оператор в свой тег заголовка:

<style>
a:link{
  text-decoration: none!important;
  cursor: pointer;
}
</style>

Ответ 5

Попробуйте разместить text-decoration: none; на своем a: hover css.

Ответ 6

У меня есть ответ:

<a href="#">
    <div class="widget">  
        <div class="title" style="text-decoration: none;">Underlined. Why?</div>  
    </div>
</a>​

Он работает.

Ответ 7

Нет подчеркивания, даже я удалил 'text-decoration: none;' от вашего кода. Но у меня был подобный опыт.

Затем я добавил код

a{
 text-decoration: none;
}

и

a:hover{
 text-decoration: none;
}

Итак, попробуйте код: hover.

Ответ 8

попробуйте добавить это в таблицу стилей:

a {text-decoration:none;}

Ответ 9

Я использовал приведенный ниже код, чтобы заставить мой работать в Chrome. Вы можете настроить вложенность:

a:-webkit-any-link { color: black; }

Ответ 10

У меня было много головной боли, когда я пытался настроить тему WordPress, и текстовое оформление мне не помогло. В моем случае мне пришлось также удалить тень.

a:hover {
    text-decoration: none;
    box-shadow: none;
}

Ответ 11

Я просто сделал это по-старому, я знаю, что это не так, но это быстро исправить.

<h1><a href="#"><font color="#FFF">LINK</font></a></h1>