Как получить колонтитула, где я хочу

У меня есть страница со следующей структурой:Как получить колонтитула, где я хочу

<!DOCTYPE html> 
<html><head><meta charset="UTF-8"> 
<title>Dashboard</title> 
<link rel="stylesheet" type="text/css" href="css/coachmaster.css" /> 
<script type="text/javascript" src="/js/jquery.js"></script> 
<script type="text/javascript" src="js/jquery-ui.js"></script> 
<script type="text/javascript" src="dashboard.js"></script> 
</head> 
<body> 
<div id="outer"> 
    <div id="wrap1"> 
    <img id="logo" src="/images/dashboard.png" /> 
    <div id="status">Status</div> 
    <div id="menu">Menu</div> 
    </div> 
    <div id="grip1" ></div> 
    <div id="wrap2"> 
    <div id="content"> 
     <table class="title"><tr><td>Ian's Dashboard</td></tr></table> 
     <div class="fields">This is the screen content 
     </div> 
     <table class="listhead"><tr>.. row of command buttons... </tr></table> 
    </div> 
    </div> 
</div> 
</body> 
</html>

Ключевой фрагмент CSS являются:

div.fields { 
    position: absolute; 
    top: 32px; bottom: 36px; 
    width: 99.8%; 
    overflow-y: scroll; 
    border-right:1px solid #d3d1d1; 
    border-left:1px solid #d3d1d1; 
} 
table.listhead { 
    position: fixed; 
    bottom: 0; 
    width: 100%; 
}

Это означает, что .listhead таблица всегда в нижней части экрана, и когда div.fields становится слишком большим для доступного пространства, появляется вертикальная полоса прокрутки.

Клиент хочет, чтобы table.listhead перемещался, чтобы прижаться к div.fields, поэтому под ним появляется свободное место.

Я пробовал все, что мог, чтобы достичь этого, и потерпел неудачу. Я задавался вопросом об обертке div.fields с table.listhead, но я не мог заставить ничего работать.

Возможно ли это?

Спасибо. Ian

источник

2013-08-20 Ian

Если вы пытаетесь сделать JSFiddle с кодом, я уверен, что кто-то может помочь вам быстрее , Приветствия. – kery

Я попытался сделать jsFiddle проблемы. Отсутствие js и изображений отсутствует - см. Http://jsfiddle.net/rCFng/1/ - нижний колонтитул должен показывать изображение, которое читает «редактировать». – Ian

немного легче понять, спасибо! :)

Я хотел бы попробовать играть с позиции, я мог двигать нижнюю таблицу вверх, выполнив:

table.listhead { 
    position:relative; 
    top: 285px; 
}

источник

2013-08-20 21:09:50 kery

Действительно, но это не поможет. Точное значение, необходимое для 286, зависит от текущей глубины экрана и поэтому требует javascript. Я не хочу использовать JS, если могу помочь. – Ian

Как получить колонтитула, где я хочу

ответ

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