Несколько таблиц CSS на одной странице с разными идентификаторами

У нас есть две разные таблицы на одной странице. разные идентификаторы, необходимые для другой цели. Итак, мы создали несколько элементов таблицы CSS в Style. Но работает только первый. Если я сохраню дизайн клиентов наверху, он будет применяться, но только по одному за раз.

#salescss {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

#salescss td, #salescss th {
    border: 1px solid #ddd;
    padding: 8px;
}

#salescss tr:nth-child(even){background-color: #f2f2f2;}

#salescss tr:hover {background-color: #ddd;}

#salescss th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #357EC7;
    color: white;
body {font-family: Arial;}


 #customers {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

#customers td, #customers th {
    border: 1px solid #ddd;
    padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #357EC7;
    color: white;
body {font-family: Arial;}

Если вы не поделитесь своим релевантным HTML-кодом, мы не сможем предложить никаких предложений относительно ваших селекторов CSS.

David says reinstate Monica 29.07.2018 14:59

Это сработало. Ответ Нандиты решен. Извините за то, что не разместил HTML.

Javanewbie 29.07.2018 15:17

Я голосую за закрытие этого вопроса, потому что он был вызван простой опечаткой

Temani Afif 29.07.2018 15:18
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
CSS: FlexBox
CSS: FlexBox
Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.
3
3
87
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

У вас был отсутствующий } после #salescss th { и #customers th {

#salescss {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}    
#salescss td, #salescss th {
    border: 1px solid #ddd;
    padding: 8px;
}

#salescss tr:nth-child(even){background-color: #f2f2f2;}

#salescss tr:hover {background-color: #ddd;}

#salescss th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #357EC7;
    color: white;
    }
body {font-family: Arial;}


 #customers {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

#customers td, #customers th {
    border: 1px solid #ddd;
    padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #357EC7;
    color: white;
    }
body {font-family: Arial;}

пожалуйста, избегайте ответов на вопросы, если это простая опечатка ... для этой цели есть флажок, так как эти вопросы / ответы не будут полезны для будущих читателей и будут шуметь на сайте.

Temani Afif 29.07.2018 15:17

спасибо @TemaniAfif :) Я этого не осознавал. буду избегать в будущем. Что мне теперь делать? Следует ли мне удалить ответ и опубликовать его как комментарий?

Nandita Sharma 29.07.2018 15:19

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

Temani Afif 29.07.2018 15:20

Хорошо, сделаю это. Спасибо :)

Nandita Sharma 29.07.2018 15:21

Другие вопросы по теме