Как пропустить div на 100% без использования абсолютной позиции?

Это большая проблема для меня, я работаю над решением проблем масштабирования между различными устройствами. Было бы неплохо, если бы у меня был множитель, в который я эхом включался, если только значения javascript не могут использоваться вместо значений, например, ширины, высоты, размера шрифта и т. Д.Как пропустить div на 100% без использования абсолютной позиции?

Например, баннер stackexchange вероятно, использует абсолютную позицию, чтобы перейти на 100% по экрану, но если бы вы использовали div, с шириной 100% и плавающей влево, на концах элемента было бы некоторое пространство.

Поэтому, когда я вижу эти страницы для мобильных устройств, они разделяются секциями с использованием большого шрифта, и они кажутся быстро масштабируемыми.

Как вы достигаете эффекта абсолютного положения без абсолютных значений для ширины/высоты?

Я использовал PHP для эха в измененных переменных до загрузки страницы.

Например

<?php 
    // get device screen height width via ajax post 
    $width = $POST['value']; 
    $height = $POST['value']; 

    if(($width/$height)>1) { 
    $multiplier = 10; 
    }else { 
    $multiplier = 1; 
    } 

    // process values on page 

    $variable_height = $multiplier*30; 
    $px = "px"; 
    $concat_height = $variable_height.$px; 
    $new_height = $concat_height; 

    ?> 

    <!DOCTYPE HTML> 
    <head> 
    <style> 
    .full-span { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: <?php echo $new_height; ?>; 
    } 
    </style> 
    </head> 
    <body> 
    <div class="full-span">My height changes on device height</div> 
</body>

Довольно грязный образец, но я думаю, вы получите идею.

источник

2015-10-21 janicehoplin

ДИВ по его природа ширина – Aaron

100% вы получите то, что я спросил? pos absolute - это фактическое 100%, когда вы не можете видеть края экрана. – janicehoplin

, затем удалите границу с тега тела. 'body {margin: 0}' – Aaron

С точки зрения масштабирования, вы могли бы попробовать ...

HTML

<div class="full-span"> 
    <h1>Content</h1> 
</div>

CSS

.full-span 
{ 
    background: url(..img/whatever.png); 
    background-size: contain; 
    height: 10%; /* or whatever */ 
    max-height: 200px; /* or whatever */ 
}

источник

2015-10-21 16:16:33 AdamJeffers

Как пропустить div на 100% без использования абсолютной позиции?

ответ

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