CSS закругление углов! - HTML и CSS

zeromind · 15.05.2011, 15:22

скажите чем обычно пользуються для закругления углов в ie ? пробывал всякие файлы .htc, эффект был таков, закругление бордера (рамки есть) но блок всё равно получаеться прямоугольный.. если сделать блоку padding: 5px тогда эффект естественно работает, но мне мейдинг не нужен!!! и это работает только на врапере.. если другой обычный блок div добавить в свойства - behavior: url(ie-css3.htc); border-radius: 10px; border:1px solid black; то эффекта вообще нету!!! бордера вообще нет и цвет пустой, один текст!
захожу через ие на сайт http://css3pie.com/ углы все отображаетсья четко причем и тень и грандиент!! в опере у меня была только проблема с отображением градиента а так всё норм!..
собственно вопрос .htc файлы вообще дают эффект в ie при верстке div'ами ? перепробывал кучу способов. подходил только jq но и то геморный он, большой вес, и как показалось не гладко делает углы..

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

Виталий Желтяков · 15.05.2011, 19:20

Попробуйте это - css3pie

zeromind · 16.05.2011, 01:14

я же написал все методы практически пробывал с .htc и jq ..
главный бордер врапер заккругляеться (и то картинка и блок нет, только рамка, при padding:5px всё хорошо, но отступ напрягает!) остальные дивные блоки без закругления!!

CCS код:

Код:

* {
        margin:0;
        padding:0;
        } 
        
        html,body { 
        height: 100%; 
        }
   
        body {
        font: 12px tahoma; /* Шрифт на веб-странице */
        background: url(img/fon.png) repeat;
        }
#container {
        width: 950px; /* Ширина слоя */
        margin: 0 auto; /* Выравнивание по центру */
        background: #f5f5f5; /* Цвет фона левой колонки */
        border:2px solid black;
    border-radius: 10px;
    -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        behavior: url(ie-css3.htc);
        overflow:hidden;
        height: 100%;
        }
   
    body > #container {height: auto; min-height: 100%;}
   
    #container a {
    cursor: pointer;
    }
 
   
        #header {
        margin: 0;
        font-size: 12px; /* Выравнивание по центру */
        padding: 0px; /* Цвет фона шапки */
        color: #000; /* Цвет текста */
        }
        
        #sidebars {
        width: 170px; /* Ширина слоя */
        padding:5px;
        background: #f5f5f5;
        float:left;
        border-right:1px dotted gray;
    padding-bottom: 32767px;
    margin-bottom: -32767px;
        }
        
    #content {
    margin-left:180px;
        padding: 15px; /* Поля вокруг текста */
        margin-top: 20px;
        background: #f5f5f5; /* Цвет фона правой колонки */
        line-height: 150%;
        font-size: 14px;
        font-family: Tahoma;
        text-indent: 25px;
        padding-bottom: 50px;
        padding-bottom: 32767px;
    margin-bottom: -32767px;
    }
   
 
   
    #footer {
        background: #f5f5f5; /* Цвет фона подвала */
        color: #000;
        border-top: 1px;
        border-top-style: solid;
        border-top-width: thin;
        font-family:Tahoma;
        font-size:14px;
        text-align: center;     
        position: relative;
        margin-top: -50px;
        height: 50px;
        clear:both;
    }
       .sidetitle {
        border: 1px solid #696;
        text-align: center;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        border-radius: 8px;
        -webkit-box-shadow: #666 0px 2px 3px;
        -moz-box-shadow: #666 0px 2px 3px;
        box-shadow: #666 0px 2px 3px;
        background: #8684F6;
        background: -webkit-gradient(linear, 0 0, 0 bottom, from(#8684F6), to(#D9E9FC));
        background: -moz-linear-gradient(#8684F6, #D9E9FC);
        background: linear-gradient(#8684F6, #D9E9FC);
        -pie-background: linear-gradient(#8684F6, #D9E9FC);
        behavior: url(ie-css3.htc);
        height: 100%;
        padding: 10px;
        }

структура дивов

Код:

<body>
 <div id="container">
   <div id="header">
<?php include("blocks/header.php");
?>
 </div>

    <div id="sidebars">
<?php include("blocks/sidebars.php");
?>
</div>
   <div id="content">

</div>
   
   </div>
 
   <div id="footer">
<?php include("blocks/footer.php");
?>
 </div>
</div>
</body>

savva-paladin · 28.05.2011, 08:35

Покачто даже IE9 не поддерживает css3 (втом числе и скругления углов). Рабочих костылей для скруления фиг найдёшь, такчто самый оптимальный вариант - картинки.

marccella · 04.06.2011, 02:01

Цитата:

Сообщение от zeromind

неужели нужно юзать метод с картинками для углов?

Да, а что тут такого...

Если интересует как делаются закругленные углы на "каждом втором сайте", установи FireBug и смотри как там делается.

15.05.2011, 15:22	#1
zeromind Новичок Джуниор Регистрация: 15.05.2011 Сообщений: 2	CSS закругление углов! скажите чем обычно пользуються для закругления углов в ie ? пробывал всякие файлы .htc, эффект был таков, закругление бордера (рамки есть) но блок всё равно получаеться прямоугольный.. если сделать блоку padding: 5px тогда эффект естественно работает, но мне мейдинг не нужен!!! и это работает только на врапере.. если другой обычный блок div добавить в свойства - behavior: url(ie-css3.htc); border-radius: 10px; border:1px solid black; то эффекта вообще нету!!! бордера вообще нет и цвет пустой, один текст! захожу через ие на сайт http://css3pie.com/ углы все отображаетсья четко причем и тень и грандиент!! в опере у меня была только проблема с отображением градиента а так всё норм!.. собственно вопрос .htc файлы вообще дают эффект в ie при верстке div'ами ? перепробывал кучу способов. подходил только jq но и то геморный он, большой вес, и как показалось не гладко делает углы.. закругленные углы вижу на каждом втором сайте, скажите что же юзают чтоб было всё ок? какой метод.. так же хочу узнать чтоб была и поддержка тени и грандиент по возможности, неужели нужно юзать метод с картинками для углов?

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Перевод величин углов	Lexus315	Общие вопросы Delphi	1	31.03.2009 10:05
Сглаживание углов формы.	celovec	Общие вопросы Delphi	12	10.02.2009 17:44
Закругление краёв компонента	SeregaIRK	Компоненты Delphi	2	18.09.2008 18:34
обозначение углов	BuBen4ik	Помощь студентам	3	18.04.2007 14:11

15.05.2011, 19:20	#2
Виталий Желтяков Старожил Регистрация: 19.04.2010 Сообщений: 2,702	Попробуйте это - css3pie

28.05.2011, 08:35	#4
savva-paladin Пользователь Регистрация: 09.07.2010 Сообщений: 89	Покачто даже IE9 не поддерживает css3 (втом числе и скругления углов). Рабочих костылей для скруления фиг найдёшь, такчто самый оптимальный вариант - картинки.