Создание блока с закругленными углами
- Автор темы alex777
- Дата начала
- Статус
Будет квадратная рамка
+ CSS
Для нормальных браузеров всё ок...для ие..в ие7-8 вроде стандартно закругляется. Ну или альтернативный вариант с картинками...во всех браузерах
Код:
<fieldset>
<legend>Добавить сайт</legend>
<!-- Некоторый контент -->
</fieldset>
Код:
fieldset {
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
tigra60
Спасатель
- Регистрация
- 10.12.2009
- Сообщения
- 1 990
Если рамка фиксированная,
А если должна тянуться по высоте при добавлении пунктов,
Картинки и исходники в прикрепленном файле. Проверено: Опера ИЕ 6 и 8, Файерфокс.
Удачи!
Извините, заметил жучка в ИЕ-6!
Для устранения к стилю списка UL добавьте
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<style>
#add_site {
width:400px;
height:100px;
background-image:url(bg.png);
}
#add_site h3 {
color:#FF0000;
text-transform:uppercase;
font-family:Arial, Helvetica, sans-serif;
margin:0px;
padding-left:25px;
}
#add_site h3 span {
background-color:#fff;
padding:0px 5px;
}
#add_site ul {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:small;
list-style-image: url(dot.png);
}
</style>
</head>
<body>
<div id="add_site">
<h3><span>Добавить сайт</span></h3>
<ul>
<li><a href="">Добавить сайт в каталог</a></li>
<li><a href="">Мои сайты</a></li>
</ul>
</div>
</body>
</html>
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<style>
#add_site_carrier {
background-image:url(bg_top.jpg);
width:400px;
}
#add_site {
background-image:url(bg_bottom.jpg);
background-repeat:no-repeat;
background-position:bottom;
padding-bottom:20px;
}
#add_site h3 {
color:#FF0000;
text-transform:uppercase;
font-family:Arial, Helvetica, sans-serif;
margin:0px;
padding-left:25px;
}
#add_site h3 span {
background-color:#fff;
padding:0px 5px;
}
#add_site ul {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:small;
list-style-image: url(dot.png);
}
</style>
</head>
<body>
<div id="add_site_carrier">
<div id="add_site">
<h3><span>Добавить сайт</span></h3>
<ul>
<li><a href="">Добавить сайт в каталог</a></li>
<li><a href="">Мои сайты</a></li>
</ul>
</div>
</div>
</body>
</html>Удачи!
Извините, заметил жучка в ИЕ-6!
Для устранения к стилю списка UL добавьте
Код:
margin-bottom:0px;- Статус
