умный div

S
На сайте с 09.03.2012
Offline
72
728

привет

есть два div'a, стоящие рядом, то есть

1, {

float: left;

width: 50%;

}

2. {

float: right;

}

в первом всегда есть текст, во втором не всегда

как сделать так, чтоб когда текста нет, первый div растягивался на ширину страницы, а на страницах, с заполненным 2-м div'ом сужался и давал второму возможность встать рядом (слева, например).

eis
На сайте с 18.10.2008
Offline
473
eis
#1

snaggy, javascript

- Здесь я покупаю вечные ссылки на свои сайты! (https://backlinkator.com) - сотни ссылок за копейки
S
На сайте с 09.03.2012
Offline
72
#2
eis:
snaggy, javascript

буду премного благодарен за код ибо слово "javascript" само по себе ничего на сайте не нашаманит ))

eis
На сайте с 18.10.2008
Offline
473
eis
#3

snaggy, с помощью if'а определять есть ли во втором div текст и если нету то задавать параметр ширины на 100%, иначе - ничего не делать.

богоносец
На сайте с 30.01.2007
Offline
754
#4

<!doctype html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<style>
.some {
float: right;
max-width: 40%; margin: 3%;
background-color: #FFA;
}

.text {
padding: 3%;
background-color: #AFF;
}

hr { clear:both }
</style>
</head>

<body>
<div class="some">А тут текст бывает иногда.</div>
<div class="text">Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. </div>

<hr>
<div class="some"></div>
<div class="text">Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. </div>

<hr>
<div class="some">А тут текст бывает иногда. А тут текст бывает иногда. А тут текст бывает иногда. А тут текст бывает иногда. </div>
<div class="text">Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. Тут текст есть всегда. </div>

</body>
</html>
дани мапов
На сайте с 06.09.2012
Offline
204
#5
snaggy:
привет

есть два div'a, стоящие рядом, то есть

1, {
float: left;
width: 50%;
}

2. {
float: right;
}

в первом всегда есть текст, во втором не всегда
как сделать так, чтоб когда текста нет, первый div растягивался на ширину страницы, а на страницах, с заполненным 2-м div'ом сужался и давал второму возможность встать рядом (слева, например).

Задача какая-то непонятная, если текст прямо в div выводится - можно просто дописать:


<div style="width:<?=(empty($text)) ? '50' : '100'?>%"><?=$text?></div>
<div style="float:right"></div>

Или пользователь вводит этот текст в input?

Написание и доработка скриптов (PHP, MySQL, JavaScript, jQuery) (/ru/forum/811046)
S
На сайте с 09.03.2012
Offline
72
#6

так, я понял) моих знаний для ответа на эти вопросы явно не хватает, выложу что есть

1. первый (выводит описание рубрики, wordpress) - тут текст есть всегда

<?php

$category_description = category_description();
if ( ! empty( $category_description ) )
echo '<div class="archive-meta">' . $category_description . '</div>';
?>

2. второй (выводит список подрубрик, если они есть)

<div class="catlist">
<ul>
<?php // list child categories
$cat_id = get_query_var('cat');

$catlist = wp_list_categories('echo=0&order=DESC&title_li=&use_desc_for_title=0&orderby=id&style=list&show_option_none=&show_count=1&child_of=' . $cat_id);
if ($catlist) {
echo $catlist;
}
?>
</ul>
</div>

соответственно, если подрубрик нет, то первый div надо растянуть на 100% , если подрубрики есть, то первый сузить и дать место второму (например, справа)

дани мапов
На сайте с 06.09.2012
Offline
204
#7

Так можно вообще не выводить второй див, если подрубрик нет. Ну или сделать по тому варианту, что я выше предлагал.


<?php // list child categories
$cat_id = get_query_var('cat');

$catlist = wp_list_categories('echo=0&order=DESC&title_li=&use_desc_for_title=0&orderby=id&style=list&show_option_none=&show_count=1&child_of=' . $cat_id);
if ($catlist) {
?>
<div class="catlist">
<ul><?php echo $catlist; ?></ul>
</div>
<?php
}
?>
S
На сайте с 09.03.2012
Offline
72
#8

дани мапов, сделал по первому варианту, то есть вставил внутрь дивов куски своих кодов, но опять то же самое - первый див так и сохраняет ширину на 50% даже если соседний пуст

---------- Добавлено 18.03.2013 в 12:17 ----------

а по второму варианту - если рубрик нет, то и список не выводится - это есть в самом примере

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий