Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Дивы выподают из контейнера / 12 сообщений из 12, страница 1 из 1
28.01.2016, 12:44
    #39157350
Areostar
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Делаю страничку:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
        <meta name="robots" content="index,follow" />
	
	<title>Auction | Main Page</title>
			     
        <link rel="stylesheet" href="css/styles.css" />
            
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
</head>

<body>
	<div class="container">
		<div class="logo">
			<a href="index.html"><img src="images/auction_logo.png" /></a>
			<div class="language"><ul><li>Русский</li><li>English</li></ul></div>
		</div>
		
		<div class="menu">
			<ul>
				<li>Пункты для меню</li>
			</ul>
		</div>
		
		<div class="main_text">
			<p>Текст приветствие для посетителей сайта.</p>
		</div>
		
		<div class="content">
                        //Вот эти дивы отображаются вне контейтера(контейнер бордер имеет)
			<div class="last_lots">fghjkl</div>
			<div class="new_lots">ghjkl;</div>
		</div>
    </div>
</body>
</html>



Вот стили страницы:
Код: css
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
.container
{
	margin:auto;
	width:960px;
	height:auto;
	border:2px #1f4b8e solid;
}

.language
{
	float:right;
	color:#3262FF;
	font-size:18px;
	font-weight:bold;
}

.menu
{
	text-align:center;
	padding-top:7px;
	width:100%;
	height:auto;
	color:#3262FF;
	font-size:18px;
	font-weight:bold;
}

.language ul, .menu ul
{
    margin: 0;
	width:90%;
	margin:auto;
    padding: 4px;
}

.language ul li, .menu ul li 
{
    display: inline;
	text-align:center;
    margin-right: 5px;
    padding: 3px;
}

.menu ul li a
{
	text-decoration:none;
}

.main_text
{
	text-align:center;
	font-size:16px;
	font-weight:bold;
}

.content
{
	width:100%
}

.last_lots
{
	width:50%;
	float:left;
}

.new_lots
{
	width:50%;
	float:left;
}



дивы .last_lots и new_lots отображаются вне контейнера(вне его бордера)
как мне это поравить? можно конечно сделать таблицу из дивов но как потом страничку респонсивной сделать?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 13:49
    #39157453
Zoria
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Areostar,

https://css-tricks.com/all-about-floats/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 14:16
    #39157498
Areostar
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Zoria,

А своими словами сказать млжете?

Я пробвыал задать для last_lots float:left;
а для new_lots float:right;

непомогло. может кеш не очистел. сейчас ещё раз попробую

Какае ещё советы есть?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 15:13
    #39157612
Gwa
Gwa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Areostar,
добавьте например элемент <br> в самый конец контейнера
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 15:50
    #39157655
Zoria
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
AreostarА своими словами сказать млжете?
вы вникните. не пожалеете. если вообще собираетесь css дальше заниматься..
тяжело на английском, ищите на русском. https://habrahabr.ru/post/136588/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 15:52
    #39157658
Areostar
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Gwa,

прибавляет контенеру 1 строку высоты а мне куда больше надо!

Я же прописал контейнеру height:auto; ??

Что не так?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 16:46
    #39157708
SharuPoNemnogu
SharuPoNemnogu
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
поставь контенту float: left; или после блоков воткни див со стилем clear:both;

про br, раньше был <br clear="all" />, сейчас хз как с ним дела обстоят
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2016, 18:16
    #39157810
Areostar
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
SharuPoNemnogu,

Спасибо, сам по тихоньку доходить стал но ещё бы долго мучился!

Сейчас попробую!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2016, 16:27
    #39158682
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Gwaдобавьте например элемент <br> в самый конец контейнера
Жуть.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2016, 16:29
    #39158685
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
SharuPoNemnoguпоставь контенту float: left;
И получит новые проблемы...

SharuPoNemnoguили после блоков воткни див со стилем clear:both;

про br, раньше был <br clear="all" />, сейчас хз как с ним дела обстоят
Ребята, как далеки вы от народа...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2016, 16:31
    #39158694
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
Areostarдивы .last_lots и new_lots отображаются вне контейнера(вне его бордера)
как мне это поравить?
Все, что тебе нужно это

Код: css
1.
2.
3.
4.
.content {
	width:100%;
	overflow: auto;
}



Иллюстрация...

 
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
.container {
	margin:auto;
	width:960px;
	height:auto;
	border:2px #1f4b8e solid;
}
.language {
	float:right;
	color:#3262FF;
	font-size:18px;
	font-weight:bold;
}
.menu {
	text-align:center;
	padding-top:7px;
	width:100%;
	height:auto;
	color:#3262FF;
	font-size:18px;
	font-weight:bold;
}
.language ul, 
.menu ul {
    margin: 0;
	width:90%;
	margin:auto;
    padding: 4px;
}
.language ul li, 
.menu ul li {
    display: inline;
	text-align:center;
    margin-right: 5px;
    padding: 3px;
}
.menu ul li a {
	text-decoration:none;
}
.main_text {
	text-align:center;
	font-size:16px;
	font-weight:bold;
}
.content {
	width:100%;
	background-color: yellow;
	overflow: auto;
}
.last_lots {
	width:50%;
	float:left;
}
.new_lots {
	width:50%;
	float:left;
}
</style>
<script type='text/javascript'>
</script>
</head>
<body>
	<div class="container">
		<div class="logo">
			<a href="index.html"><img src="images/auction_logo.png" /></a>
			<div class="language"><ul><li>Русский</li><li>English</li></ul></div>
		</div>
		<div class="menu">
			<ul>
				<li>Пункты для меню</li>
			</ul>
		</div>
		<div class="main_text">
			<p>Текст приветствие для посетителей сайта.</p>
		</div>
		<div class="content">
            <!--Вот эти дивы отображаются вне контейтера(контейнер бордер имеет)-->
			<div class="last_lots">fghjkl</div>
			<div class="new_lots">ghjkl;</div>
		</div>
    </div>
</body>
</html>

...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
30.01.2016, 20:55
    #39159287
Areostar
Areostar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Дивы выподают из контейнера
krvsa,

Спасибо, запомню!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Дивы выподают из контейнера / 12 сообщений из 12, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 412ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1445459]:
 0ms
get settings:
 5ms
get forum list:
 9ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 139ms
get topic data:
 6ms
get forum data:
 2ms
get page messages:
 25ms
get tp. blocked users:
 1ms
others: 221ms
total:  412ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]