Хром неправильно читая максимальная высота и максимальная ширина - PullRequest
0 голосов
/ 26 февраля 2012

Я действительно смущен ...

Предупреждение в следующем коде не показывает правильные значения для max-height и max-width в Chrome. Я последовательно получаю значения на 10% больше, чем реальные! В Chrome предупреждение: «высота: 500, максимальная высота x ширина: 1100 x 2200, отступы: 20». В любом другом браузере значения верны, и в jsfiddle это тоже нормально (работает в Chrome).

Я что-то упускаю из виду?

Разделение составного parseInt / .css ("..") дало те же результаты, то есть 1100px 1100

<!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=utf-8" />
<title>Untitled Document</title>
<style>
#mainContent { 
    height: 500px;
    max-height: 1000px;
    max-width: 2000px;
    padding-left: 20px;
} 
</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
    var height = parseInt($("#mainContent").height());
    var maxHeight = parseInt($("#mainContent").css("max-height"), 10);
    var mainContentWidthPadding = parseInt($("#mainContent").css("padding-left"), 10);
    var maxWidth = parseInt($("#mainContent").css("max-width"), 10);
    alert("height: " + height + ", max height x width: " + maxHeight + " x " + maxWidth + ", padding: " + mainContentWidthPadding);
});
</script>

</head>

<body>
<div id="mainContent"></div>

</body>
</html>

Ответы [ 2 ]

0 голосов
/ 27 февраля 2012

Нашел это !! Каким-то образом , масштаб был настроен на, думаю, 110% - и только на этой вкладке! Я понятия не имею, как, не смотрел там, никогда не использую это. ((Румяна))

0 голосов
/ 26 февраля 2012

Попробуйте это.

#mainContent {
    height: 500px;
    max-height: 1000px;
    max-width: 2000px;
    padding-left: 20px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

Значение поля рамки (в отличие от значения по умолчанию для поля содержимого) делает окончательный визуализированный блок объявленной шириной, а все границы и отступы внутри блока обрезаются.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...