Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.01.2015, 14:08
Аспирант
Отправить личное сообщение для kilohertz_. Посмотреть профиль Найти все сообщения от kilohertz_.
 
Регистрация: 07.12.2014
Сообщений: 31

Вложенные элементы
Почему блок <section id="container">...</section> не считается вложенным в body? (Скрин)

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<link href="" type="text/css" rel="stylesheet" id="maincss">
	<link href="http://grenst.ru/style/admin.css" type="text/css" rel="stylesheet">
	<script type="text/javascript">
		document.getElementById('maincss').href = "http://" + location.hostname + "/style/style.css";
	</script>
</head>
<body>
<section style="width: 100%; height: 36px; background: #DCDCDC;">
	<nav style="width: 1024px;" class="w_c">
		<ul class="ul_menu" style="float: left;">
			<li class="li_l f_l">Объявления</li>
			<li class="li_l f_l">Компании</li>
		</ul>
		<ul class="ul_menu" style="float: right;">
			<li class="li_l f_l">Добавить объявление</li>
			<li class="li_l f_l">Поиск</li>
			<li class="li_l f_l">Вход</li>
		</ul>
	</nav>
</section>
<hr style="margin: 0px; padding: 0px; box-shadow: 0 1px 10px rgba(0,0,0,0.5);" color="#808080">
<section id="header" class="w_c">
</section>
<div class="w_c place_10px"></div><section id="container" class="w_c">
	<div class="adm_cont_l d_ib f_l">
		<ul style="list-style: none; margin: 0px; padding: 0px;" class="f_l">
			<a href="admin.php"><li class="t_l adm_li_l">Главная</li></a>
			<a href="admin.php?section=db"><li class="t_l adm_li_l">Администрирование БД</li></a>
			<a href="admin.php?section=advert"><li class="t_l adm_li_l">Модерация объявлений</li></a>
			<a href="admin.php?section=users"><li class="t_l adm_li_l">Пользователи, компании</li></a>
		</ul>
	</div>
	<div class="adm_cont_r d_ib f_r">
		<script type="text/javascript">
	var xhr, object;
	var messages = {complete:"Запись добавлена", failed:null};
	
	function sendInfo(form) {
		var elements = document.getElementById(form).getElementsByClassName(form);
		var query = "section=db&type=ajax&form=" + form + "&";
		for(i=0; i<elements.length; i++) {
			query = query + elements[i].getAttribute('name');
			query = query + "=" + elements[i].value;
			if(i < elements.length-1) query = query + "&";
		}
		object = form;
		xhr = new XMLHttpRequest();
		xhr.open('POST', 'admin.php', true);
		xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
		xhr.send(query);
		xhr.onreadystatechange = processingXML;
	} 
	
	function processingXML() {
		if(xhr.readyState == 4) {
			var xml = xhr.responseXML;
			if(xml.getElementsByTagName('status')[0].getAttribute('value') == "true") {
				document.getElementById(object + '_sysmsg').firstChild.nodeValue = "Запись добавлена";
			}
		}
	}
</script>
<div class="w100">
	<span class="t_c w100 title d_b">Регионы</span>
	<div style="margin-left:10px; width: calc(100%-10px);">
		<span class="d_b t_l p-b">Редактирование списка областей:</3span>
		<form id="_form_reg">
			<div class="w100 d_t-r">
				<div style="width:100px;" class="d_i-b">Страна:</div>
				<div style="width:200px;"  class="d_i-b">
					<select style="width:197px;" name="country" class="_form_reg">
						<option>Россия</option>
						<option>Украина</option>
					</select>
				</div>
				<div style="width:100px; padding-left: 10px;" class="d_i-b">Область:</div>
				<div style="width:200px;" class="d_i-b">
					<input type="text" style="width:197px;" name="reg" class="_form_reg">
				</div>
			</div>
		</form>
		<div class="d_b w100 p-t">
			<div class="t_c f_l d_n" style="font-size: 13px;"><span id="_form_reg_sysmsg"> </span></div>
			<div class="t_r f_r"><span style="padding-right: 10px;">Добавить область:</span><button onclick="sendInfo('_form_reg');">Добавить</button></div>			
		</div>
		<hr style="width: 100%;">
		<span class="d_b t_l p-b p-t">Редактирование списка городов:</span>
		<form id="_form_city">
			<div class="w100 d_t-r">
				<div style="width:100px;" class="d_i-b">Страна:</div>
				<div style="width:200px;"  class="d_i-b">
					<select style="width:197px;" class="_form_city" name="country">
						{COUNTRY}
					</select>
				</div>
			</div>
			<div class="place_10px"></div>
			<div class="w100 d_t-r">
				<div style="width:100px;" class="d_i-b">Область:</div>
				<div style="width:200px;"  class="d_i-b">
					<select style="width:197px;" class="_form_city" name="reg">
					</select>
				</div>
				<div style="width:100px; padding-left: 10px;" class="d_i-b">Город:</div>
				<div style="width:200px;" class="d_i-b">
					<input type="text" style="width:197px;" class="_form_city" name="city">
				</div>
			</div>
		</form>
		<div class="d_b w100 t_r p-t">
			<span style="padding-right: 10px;">Добавить город:</span><button onclick="sendInfo('_form_city')">Добавить</button>
		</div>
	</div>
</div>
	</div>
</section>
Ответить с цитированием
  #2 (permalink)  
Старый 07.01.2015, 14:20
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Скорее всего у твоих блоков прописано в стилях float:left float:right. Эти элементы выпадают из потока и родитель их не учитывает. Гугли clearfix.

К слову тег section не для этих целей был придуман.
Сообщение от kilohertz_.
margin-left:10px; width: calc(100%-10px);">
Зачем width задавать? Разве по auto не займет все доступную ширину?
Вобще хаос в стилях. Куча дерьма прям. И xml - гавно мамонта. Все гавно у тебя. Извини за правду )
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 07.01.2015, 14:45
Аспирант
Отправить личное сообщение для kilohertz_. Посмотреть профиль Найти все сообщения от kilohertz_.
 
Регистрация: 07.12.2014
Сообщений: 31

ахахах, да норм, критика то обоснованна, будем исправляться.
Да, в стилях position: relative и float:left/right. Но как иначе тогда делать?
Ответить с цитированием
  #4 (permalink)  
Старый 07.01.2015, 14:58
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

ИМХО, вместо <span style="padding-right: 10px;">Добавить город:</span><button onclick="sendInfo('_form_city')">Добавить</button> лучше сразу написать <button onclick="sendInfo('_form_city')">Добавить город</button>
Ответить с цитированием
  #5 (permalink)  
Старый 07.01.2015, 19:06
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от kilohertz_.
Но как иначе тогда делать?
Сообщение от danik.js
Гугли clearfix.
body:after{
    content: '';
    display: table;
    clear: both;
}
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как вычленить вложенные элементы telez Элементы интерфейса 12 29.04.2014 18:57
jQuery UI Sortable. Элементы съезжают BelkinV jQuery 1 29.04.2014 00:47
Вложенные элементы telez Элементы интерфейса 8 28.04.2014 15:04
Выбрать элементы, в которые вложен элемент с id. Вадимчег jQuery 3 24.11.2012 10:38
toggle и вложенные элементы john-samilin jQuery 1 14.07.2011 17:48