Закругление углов у таблицы - HTML и CSS

ONKTINOM · 18.06.2016, 11:46

Люди нужна помощь
Не могу закруглить углы таблицы вместе с фоном

Код HTML:

<html>
    <head>
       
        <title>Homework</title>
		<style type="text/css">
		body {
		margin: 0 0 0 0;
		}
.menu1{
 position: fixed; 
    right: 10px; 
    top: 20;
}
a{
position: right;
top: 30;
}
header { 
        height: 110px;
        background-image: url("bg-shapka.gif");
        background-repeat: repeat-x;
    }
.1 {
margin-top: 0px;
height: 50px;
background-image: url("fon1.gif");
        background-repeat: repeat-x;
		}
#right{
position: absolute;
top: 0;
left: 10;
height:500px;
} 

.table_block {
border-top-left-radius: 20px;
border-top-right-radius:20px;
border-radius: 20px;
background: #db251c;
color: white;
text-shadow: 0 1px 1px #2D2020;
padding: 10px 25px;
    font-size: 16px;
    font-weight: bold;
	border-collapse: collapse;
	border-color: transparent;
	border-spacing: 1px 1px;
	}
th{
background: #ff0000;
}
 
	
	}
	table {
	border-spacing: 1;
	}
	tr:nth-child(1) {
	  backgroud: #db251c;
color: #ffffff;	  
	  }
 tr:nth-child(2n)
 {
 background: #cccccc;
 }
 td{
border: 1px solid #ffffff;
}

	
	  
</style>
		
    </head>
	 <body bgcolor="#0a6a02">
	        <header>
		<div class="menu1">
          <a href="http://meguin312.kg/">
		  <font size="6" color="#ffffff" face="arial"><b>ГЛАВНАЯ</font></a>
		  <font size="7" color="#ffffff"> | </font>
 		  <a href="http://meguin312.kg/"><font size="6" color="#ffffff" face="arial">О КОМПАНИИ</font></a>
		  <font size="7" color="#ffffff"> |  </font>
<a href="http://meguin312.kg/"><font size="6" color="#ffffff" face="arial">ПРОДУКЦИЯ</font></a>
<font size="7" color="#ffffff"> | 
<a href="http://meguin312.kg/"><font size="6" color="#ffffff" face="arial">ДИЛЕРЫ</font></a>
<font size="7" color="#ffffff"> | </font>
<a href="http://meguin312.kg/"><font size="6" color="#ffffff" face="arial">КОНТАКТЫ</b></font></a>
</div>
        </header>
    
<div id="right">
    <img src="logo.png" alt="Logo" />
   </div >
   <br/>
	<br/>
<table align="center" class="table_block" cellspacing="20" cellpadding="20">
<tr>
<td>Емкость</td>
<td>упак.ед.</td>	
<td>№ арт.</td>
</tr>
<tr><font color="#ffffff">
<td>1л/|</td>
<td>6</td>
<td>9427</td>
</tr>
<tr bgcolor="#dddddd">
<td>20л/|</td>
<td>1</td>
<td>3171</td>
</tr>
<tr>
<td>200л/|</td>
<td>1</td>
<td>9008</td>
</font>
</tr>
</table>
</body>
</html>

Пожалуйста, оформляйте Ваш код согласно правилам.

Naive · 18.06.2016, 12:42

кросс-браузерно не закруглишь, оборачивай в див кругли его

ONKTINOM · 18.06.2016, 12:49

В див обернул но он теперь только бордер закругляет а фон остается с углами 90 градусов не подскажешь как что бы и фон в таблице тоже скруглялся?
Заранее Спасибо

Вадим Мошев · 18.06.2016, 13:58

Попробуйте для того дива, в который вы обернули таблицу, установить overflow: hidden через CSS

Кстати, в глаза бросилось:

Код:

a{
position: right;
top: 30;
}

Это что?

ONKTINOM · 20.06.2016, 08:50

Хммм странно вчера через overflow сделал закруглилась а сегодня опять нет

а это сделано на горизонтальную менюшку что бы выровнять её в шапке

а нет всё работает просто не в тот стиль вставил))) Спасибо)))

Вадим Мошев · 20.06.2016, 21:01

Цитата:

а это сделано на горизонтальную менюшку что бы выровнять её в шапке

Выравнивание делается не так. Если уж right, то не position, а float. Но одного этого будет мало, будут последствия, которые надо уметь исправлять

А у position значения бывают только inherit, static (по умолчанию), absolute, relative и fixed

ONKTINOM · 21.06.2016, 19:40

Хммм спасибо за совет
А вы не могли бы подсказать как сделать менюшку горизонтальную и закрепить её в шапке?
И тут закавыка одна выскочила скажите как разделить два блока а то они сливаются?
Заранее Спасибо

Вадим Мошев · 21.06.2016, 21:39

Цитата:

А вы не могли бы подсказать как сделать менюшку горизонтальную и закрепить её в шапке?

Я, быть может, и не подскажу, так как я не постоянно на этом форуме (в этом причина, а не потому, что я отказываюсь вам помогать или не знаю), но другие, знающие не меньше, а то и больше меня, подсказать смогут, наверное. Так что, покажите актуальный на данный момент код. Кстати, лично я не очень понял ваш вопрос.

Цитата:

И тут закавыка одна выскочила скажите как разделить два блока а то они сливаются?

Вам нужно CSS свойство margin. Это - отступы или, как ещё можно их назвать, внешние поля.

Есть частные свойства margin-left, margin-right, margin-top, margin-bottom. Где они дают отступы, вы поймёте из названия.
Можно использовать универсальное margin: p1 p2 p3 p4;
Порядок отступов: начиная с верхнего по часовой стрелке.

Подробнее: http://htmlbook.ru/css/margin

Ну и ещё советы.
1. Форматируйте ваш код, то есть, снабжайте его вертикальными и горизонтальными отступами (это не margin, о котором я говорил).
2. Пользуйтесь правилами публикации исходного кода. Я уже давал ссылку: http://www.programmersforum.ru/showp...23&postcount=3

Naive · 24.07.2016, 06:28

читай оф-доку, на w3c, там все сказано, как работают отступы, как они схлапываются, как ведут себя в иных ситуациях.

18.06.2016, 13:58	#4
Вадим Мошев Старожил Регистрация: 12.11.2010 Сообщений: 8,568	Попробуйте для того дива, в который вы обернули таблицу, установить overflow: hidden через CSS Кстати, в глаза бросилось: Код: `a{ position: right; top: 30; }` Это что? Последний раз редактировалось Вадим Мошев; 19.06.2016 в 00:12.

20.06.2016, 08:50	#5
ONKTINOM Регистрация: 18.06.2016 Сообщений: 4	Хммм странно вчера через overflow сделал закруглилась а сегодня опять нет а это сделано на горизонтальную менюшку что бы выровнять её в шапке а нет всё работает просто не в тот стиль вставил))) Спасибо))) Последний раз редактировалось ONKTINOM; 20.06.2016 в 08:54.

21.06.2016, 19:40	#7
ONKTINOM Регистрация: 18.06.2016 Сообщений: 4	Хммм спасибо за совет А вы не могли бы подсказать как сделать менюшку горизонтальную и закрепить её в шапке? И тут закавыка одна выскочила скажите как разделить два блока а то они сливаются? Заранее Спасибо Последний раз редактировалось ONKTINOM; 21.06.2016 в 19:53.

24.07.2016, 06:28	#9
Naive Раздолбайских Дел Старожил Регистрация: 22.05.2009 Сообщений: 3,828	читай оф-доку, на w3c, там все сказано, как работают отступы, как они схлапываются, как ведут себя в иных ситуациях. Alar, верни репу!

Опции темы	Поиск в этой теме
Версия для печати Отправить по электронной почте	Поиск в этой теме: Расширенный поиск

18.06.2016, 12:42	#2
Naive Раздолбайских Дел Старожил Регистрация: 22.05.2009 Сообщений: 3,828	кросс-браузерно не закруглишь, оборачивай в див кругли его Alar, верни репу!

18.06.2016, 12:49	#3
ONKTINOM Регистрация: 18.06.2016 Сообщений: 4	В див обернул но он теперь только бордер закругляет а фон остается с углами 90 градусов не подскажешь как что бы и фон в таблице тоже скруглялся? Заранее Спасибо

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Закругление углов на Панели, проблемка	Janger	Общие вопросы Delphi	2	09.03.2016 16:10
CSS закругление углов!	zeromind	HTML и CSS	4	04.06.2011 02:01
Скругление углов таблицы	dream1k	HTML и CSS	1	09.04.2011 08:35
Закругление краёв компонента	SeregaIRK	Компоненты Delphi	2	18.09.2008 18:34
обозначение углов	BuBen4ik	Помощь студентам	3	18.04.2007 14:11