использовать начальную ширину для элемента, не работающего в IE

107

У меня есть плагин графика, который вставляет холст и легенду <table>в свой контейнер. В этом плагине tableне widthопределено, а в моем CSS есть ширина для таблиц внутри этого контейнера, в которые вставляется мой плагин.

Итак, новый div наследуется table{ width: 100%}от CSS и отображается неправильно.

Я пробовал использовать width: initial;, выглядит хорошо в Chrome, но IE не любит ^{проверять совместимость браузера}

Я допускаю изменение / принудительное использование встроенного CSS в скрипте / плагине, поскольку он должен работать в любой среде.

Какое здесь лучшее решение?

— Рикард
источник

Вы пробовали просто установить минимальную ширину? Это работает?

— BuddhistBeast

@BuddhistBeast, не думал об этом! Но попробовал это сейчас и в Chrome тоже не работал.

— Рикард

Ответы:

177

Как вы сказали, обычно width: autoбудет иметь аналогичный эффект. Имея правила:

.my-selector {
    width: auto;
    width: initial;
}

Должен вызвать его использование, initialесли он поддерживается, и в autoпротивном случае.

— Марк Роудс
источник

Это устранило мою проблему. Спасибо.

— dchayka

Просто сэкономил мне час. Спасибо.

— Skitterm

Обратите внимание initial : это допустимое значение свойства ( developer.mozilla.org/en-US/docs/Web/CSS/initial ). Но (если вы прокрутите вниз до «Совместимость браузера» в предыдущей ссылке), ни одна версия IE не поддерживает его.

— gtramontina

это известно как резервный вариант и является очень распространенным шаблоном кодирования в CSS. Кроме того , используя width: autoне только иметь подобный эффект, но он будет иметь тот же эффект, потому что autoэто определяется как начальное значение для widthсвойства.

— chharvey

Использование width: auto;inline внутри скрипта решает проблему в Chrome, FIrefox и IE 11. Просто не уверен, есть ли лучший способ.

— Рикард
источник