Не удается удалить строку в верхней части таблицы HTML
Я создаю сайт, который включает таблицу в середине домашней страницы, и я не могу получить строку (выглядит как <hr>
линия) исчезнуть из верхней части. Вот ссылка на страницу http://marccary.com/test и вот код, который я использую для таблицы:
<table cellspacing="0" cellpadding="0" border="none">
<colgroup border="none">
<col span="1" width="400" >
<col span="1" width="400" >
</colgroup>
<tr>
<td height="225" width="600"><p align="center">
<iframe width="400" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F84936057%3Fsecret_token%3Ds-4zQJw&show_artwork=true&secret_url=true"></iframe><br><span style="font-size:20px;"><a href="https://soundcloud.com/marccary" style="color:#white;">Marc Cary on Soundcloud>></a></span></p></td>
<td height="225" width="600"><p align="center">
<iframe width="400" height="225" src="http://www.youtube.com/embed/j9GhIaaEC6c" frameborder="0" allowfullscreen></iframe>
<span style="font-size:20px;"><a href="http://www.youtube.com/marccary" style="color:#white;">Marc Cary's YouTube channel>></a></savaipan></p></td></tr></table>
Я вошел в свой CSS и попытался убедиться, что на таблицах нет границ. Я поместил следующий код в мою таблицу стилей CSS:
table {
border-collapse: separate;
border-spacing: 0;
border: none !important;
border-top: none;
border-bottom: none;
}
caption,
th {
border-bottom: none;
border: none;
border-top: none;
}
td {
font-weight: normal;
text-align: left;
border-top: none;
border: none;
border-bottom: none;
}
tr {
border: none;
border-bottom: none;
border-top: none;
}
Все еще не повезло. У кого-нибудь есть предложение?
2 ответа
Добавьте следующее в ваш CSS:
hr {
height: 0px !important;
}
Кажется, вы используете программное обеспечение CMS для разработки своего сайта, а шаблон, который вы используете, на самом деле <hr>
в
<div id="page" ...>
<header id="masthead" ...>
<hgroup ...>
<nav id="site-navigation" ...>
<hr>
</header>
<div id="main" ...>
<footer ...>
</div>
У вас есть настройка CSS:
.entry-content td, .comment-content td {
border-top: 1px solid #EDEDED;
}
Это граница, которую вы видите.
Этот CSS
border-top: none;
border: none;
border-bottom: none;
можно сократить до всего
border: none;