2013-04-24 1 views
-1

Как сделать z-index подходящим для страницы, а не scalling Мне нужно выставить его из svg, но мой svg подходит для страницы.Как сделать z-index подходящим для страницы, а не scalling

вот мой ДИВ код

<div id="homeScreen" class="grey_box" style="background-color:#CDCDCD; 
    position: absolute; 
    left: 0px; 
    top: 8px; 
    width: 373px; 
    height: 537px; 
    visibility: visible;"> 
<p class="hello" >E-Number<input id="tags" /></p> 
<p class="hello2">Mat-Number<input id="tags1" /><p> 
<p class="hello3">Tech. ID<input type="text" name="fname"><p> 
<p class="hello4">RIS<input type="text" name="fname"><p> 
<p class="hello5"> <button onclick="get_action_home()" style="width: 100px">Continue</button><p> 
<p class="hello6">Βάση δεδομένων: Τοπικός</p> 
<p class="hello7">Σύνδεση: κομμένη</p> 
<p class="hello8">Κατάσταση βάσης δεδ.: Μη επίκαιρη</p> 

</div> 

вот Javascript поставить его динамически

function adjust() 
{ 

      var DMMScreen = document.getElementById("DMM"); 
      //new screens dinamic 
      var homeScreen = document.getElementById("homeScreen"); 



      homeScreen.style.height = DMMScreen.getBoundingClientRect().height; 
      homeScreen.style.width = DMMScreen.getBoundingClientRect().width; 
      homeScreen.style.top = DMMScreen.getBoundingClientRect().top; 
      homeScreen.style.left = DMMScreen.getBoundingClientRect().left; 
      // 

и вот что я нашел из JQuery, но я не знаю, как это исправить

$(window).resize(function() { 
    $("#width").text($(this).width()); 
    $("#height").text($(this).height()); 
}); 

и вот ссылка на то, что он делает [ссылка] (https://www.dropbox.com/s/ebsha1t091ewk40/good2.png) и вот плохо, когда я изменить окно [ссылка] (https://www.dropbox.com/s/b7n4nn3gg2gb6fn/good.png)

ответ

1

z-index не приспосабливает к чему-либо, это «наслоение» инструмент, позволяющий размещать элементы на верхней части друг друга, что я предположим, вы имеете в виду у вас есть position:fixed или position:absolute в сочетании с z-index .. если это так, вы можете сделать элемент соответствовать ширине страницы с помощью width:100%;

например:

<style> 
.full_width { 
    top:0; 
    left:0; 
    z-index:1; 
    height:20%; 
    width:100%; 
    position:fixed; 
    text-align:center; 
} 
</style> 
</head> 
<body> 
    <div class="full_width"> i will fit the width of the page</div> 

    your other stuff here... 
</body> 

Если это не то, что вы имеете в виду, то, пожалуйста, предоставить больше информации ..

Редактировать Звенья вы предоставили, вам не нужно использовать positionz-index или,

это будет быть столь же просто, как установка вашего margin-left и margin-right к auto и определения, что контейнер width ..

вставить CSS HTML & для этой страницы в свой вопрос, и мы можем дать вам больше помочь

, но, как он стоит, пример получения, что поле в середине вашей страницы будет

<style> 
.grey_box { 
    width:500px; 
    height:600px; 
    margin-left:auto; 
    margin-right:auto; 
    background-color:#CCC; 
} 
</style> 
<div class="grey_box"> 
<!-- your content here--> 
</div> 

Пример: http://jsfiddle.net/AbQsa/

+0

хороший один [ссылка] (https: //www.dropbox. com/s/ebsha1t091ewk40/good2.png), и здесь неверно [link] (https://www.dropbox.com/s/b7n4nn3gg2gb6fn/good.png?m), который не подходит для этой страницы! – Cbour

+0

Я обновил свой ответ. Надеюсь, это поможет –

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