следующая игра выглядит хорошо в IE 9, отступы и граница поля вычитаются из ширины из-за размера коробки: border-box. Однако, если я показываю тот же код, что и обычный html-сайт, добавление и граница добавляются к ширине, делая поле больше контейнера.IE9 показывает разные результаты одного и того же кода, если отображается в JSFiddle
Любые идеи, в чем проблема?
Вот скрипка, которая хорошо выглядит в IE9: http://jsfiddle.net/GgwNs/1/
Вот тот же код выглядит не очень хорошо отображается в виде HTML-сайта:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<style type='text/css'>
.container
{
width: 300px;
height: 30px;
border: thin solid red;
margin-bottom:60px;
}
.content
{
width: 100%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
border: 5px solid #000
}
</style>
</head>
<body>
<div class="container">
<input class="content" id="Text1" type="text" />
</div>
</body>
</html>
Спасибо
'-ms-box-sizing '? ur ожидает, что многие пользователи будут использовать IE8 beta 1? также, убедитесь, что вы показываете страницу в режиме стандартов IE9 (или IE = край) – PlantTheIdea
большое вам спасибо! сделал трюк, полностью забыл об этом ... – user2550712
np, плохо включите его в качестве ответа, чтобы вы могли поставить галочку. – PlantTheIdea