border-radius firefox не работает

Я пытаюсь заставить свойство border-radius работать на столе в Firefox. Он отлично работает в хроме, и я не забочусь об IE 8 и ниже.border-radius firefox не работает

Мой CSS:

table.tableCenter{ 
    padding: 0; 
    width: 100%; 
    -moz-border-radius: 15px; 
    -moz-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    -webkit-border-radius: 15px; 
    border-radius: 15px; 
    margin: auto; 
    overflow: hidden; 
    border-collapse: collapse; 
}

Вот скрипка демонстрирует проблему, а также. https://jsfiddle.net/1o6mzvff/

Благодарим вас за внимание.

источник

2015-11-29 user3044394

Я только что понял, что у меня есть css два раза, проигнорируйте это. Это не работает после исправления этого. – user3044394

Для меня это выглядит как border-radius не работает на <table>: Попробуйте добавить display:block; к table.tableCenter{ } и вы получите круглую границу.

Предложения:

Избавиться от стола ;-)
Или (непроверенные): Используйте <div> вместо <table> и использовать display:table (плюс display:table-row и table-cell для вложенной <tr>/<td> ' которые должны стать <div>, а также для HTML-действительности).

Я бы за первый вариант, потому что это выглядит, как вы используете таблицу только для макета, который является плохой разметкой в любом случае ;-)

источник

2015-11-29 18:30:29

Я согласен с тобой. Я получил радиус div div, чтобы нормально работать в Firefox. – user3044394

Я вынул свою верную Визуальную страницу (чрезвычайно архаичный редактор веб-страницы), и я сделал это, и он работал просто отлично:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> 
<HTML> 
<HEAD> 
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1"> 
    <META NAME="GENERATOR" Content="Visual Page 2.0 for Windows"> 
    <TITLE>untitled</TITLE> 
</HEAD> 
<BODY> 
<P> 
<TABLE BORDER="0" WIDTH="100%" STYLE="border-radius : 15px; border : 1px solid black;"> 
    <TR> 
     <TD WIDTH="33%">adfasdfsads</TD> 
     <TD WIDTH="33%">asfsdfsadfasdfsaf</TD> 
     <TD WIDTH="34%">safsadfsaf</TD> 
    </TR> 
    <TR> 
     <TD WIDTH="33%">sdfsafsdfsadf</TD> 
     <TD WIDTH="33%">sadfsadfsdfsaf</TD> 
     <TD WIDTH="34%">sfdsafsdfds</TD> 
    </TR> 
    <TR> 
     <TD WIDTH="33%">sadfsdfasfdas</TD> 
     <TD WIDTH="33%">safsdfsadf</TD> 
     <TD WIDTH="34%">safdsdfsdf</TD> 
    </TR> 
</TABLE> 
</BODY> 
</HTML>

У вас есть DOCTYPE в начале? Иногда это может повлиять на вещи. То же самое верно для команды HTTP-EQUIV Meta. Кроме того, иногда выполнение этих вещей в атрибуте STYLE будет работать, когда CSS не работает. Я знаю - не должен этого делать. Я думаю, почему это происходит, так это то, что вы получаете конфликт где-то в своем CSS, а затем команда STYLE имеет прецедент, поэтому он исправляет проблему. Неизвестно.

источник

2015-11-29 18:30:19

Это не проблема, спасибо. У меня не было типа doc-типа +1 – user3044394

HTML 3.2 - Вы серьезно? ;-) –

Эй! Он использовал столы! VP все еще будет создавать веб-страницы, которые работают во всех браузерах. Хех. Я написал программу, чтобы взять код и преобразовать его в CSS. Я бы прыгнул с корабля на новый редактор (у меня есть Dreamweaver, WebPlus и некоторые другие), но простота VP держит меня в использовании, и мой конвертер делает все тяжелое поднятие. Моя программа конвертирования выкладывает все в формате MVC, создает файлы CSS, ставит все команды на использование jQuery, стандартные функции Javascript и многое другое. Поэтому я делаю некоторые стандартные вещи, и все остальное. :-) –

АММ я думаю, вы должны добавить border: 1px solid #fff;

источник

2015-11-29 18:39:50

Это добавит границу к элементу. Ответчик пытается создать пограничный радиус. –

border-radius firefox не работает

ответ

Смежные вопросы