ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Разнести 2 inline-block div-а по разным сторонам?
12 сообщений из 12, страница 1 из 1
Разнести 2 inline-block div-а по разным сторонам?
    #38765126
NDAleksey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
NDAleksey
Участник
Как убрать расстояние отмеченное красными кружками?

Код: 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.
<style type="text/css">
    html {
        width: 1024px;
        margin: 0 auto;
        background-color: black;
    }

    body {
        font-family: "Comic Sans MS";
        width: 700px;
        margin: 0 auto;
        background-color: darkgrey;
    }

    .messageBox {
        color: navy;
        background-color: #999999;
        border-color: darkorange;
        border-width: 1px;
        border-style: dashed;
    }

    .question, .answer {
        width: 300px;
        display: inline-block;
        padding: 5px;
    }

    .question {
        background-color: #7fe4ff;
        border-radius: 10px;
        margin-top: 0px;
        vertical-align: top;
    }

    .answer {
        background-color: #95ff7a;
        border-radius: 10px;
        vertical-align: bottom;
        right: 0px;
    }
</style>
<body>
    <div class="messageBox">
        <div class="question"><br/><br/><br/></div>
        <div class="answer"><br/><br/><br/><br/></div>
    </div>
    <div class="messageBox">
        <div class="question"><br/><br/><br/><br/></div>
        <div class="answer"><br/><br/></div>
    </div>
    <div class="messageBox">
        <div class="question"><br/><br/><br/></div>
        <div class="answer"><br/><br/><br/></div>
    </div>
</body>
...
Рейтинг: 0 / 0
02.10.2014, 17:00
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765201
SharuPoNemnogu
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
SharuPoNemnogu
Участник
NDAleksey,

float?
...
Рейтинг: 0 / 0
02.10.2014, 17:42
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765205
brbrbr
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
brbrbr
Участник
У тебя ширина контейнера - 700, внутренних блоков - 300. Надо либо размер контейнера уменьшить, либо размер блоков увеличить.
...
Рейтинг: 0 / 0
02.10.2014, 17:49
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765357
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
NDAleksey,
 
через таблицу проще
Код: 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.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html {
	width:1024px;
	margin:0 auto;
	background-color:black;
}
body {
	font-family:"Comic Sans MS";
	width:700px;
	margin:0 auto;
	background-color:#A9A9A9;
}
table {
	border-collapse:collapse;
	border:1px dashed #FF8C00;
	width:100%;
}
td {
	border-top:1px dashed #FF8C00;
	vertical-align:top;
}
td+td {vertical-align:bottom;}
.question, .answer {
	width:300px;
	padding:5px;
}
.question {
	background-color:#7fe4ff;
	border-radius:10px;
}
.answer {
	background-color:#95ff7a;
	border-radius:10px;
	float:right;
}
</style>
</head>
<body>
<table>
	<tr>
		<td><div class="question"><br/><br/><br/></div></td>
		<td><div class="answer"><br/><br/><br/><br/></div></td>
	</tr>
	<tr>
		<td><div class="question"><br/><br/><br/><br/></div></td>
		<td><div class="answer"><br/><br/></div></td>
	</tr>
	<tr>
		<td><div class="question"><br/><br/><br/></div></td>
		<td><div class="answer"><br/><br/><br/></div></td>
	</tr>
<table>
</body>

<script>
</script>

</body>
</html>

...
Рейтинг: 0 / 0
02.10.2014, 19:51
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765677
NDAleksey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
NDAleksey
Участник
SharuPoNemnoguNDAleksey,

float?

покажите!
...
Рейтинг: 0 / 0
03.10.2014, 10:25
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765678
NDAleksey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
NDAleksey
Участник
brbrbrУ тебя ширина контейнера - 700, внутренних блоков - 300. Надо либо размер контейнера уменьшить, либо размер блоков увеличить.

а если я хочу, чтобы блоки отстояли друг от друга и никак иначе, что тогда?
...
Рейтинг: 0 / 0
03.10.2014, 10:26
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765682
NDAleksey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
NDAleksey
Участник
user89NDAleksey,
через таблицу проще

знаю, но дело принципа!)
...
Рейтинг: 0 / 0
03.10.2014, 10:27
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765757
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
NDAlekseyзнаю, но дело принципа!)
Зачем вы так убиваетесь? Вы же так не убъетесь!!! (с)
...
Рейтинг: 0 / 0
03.10.2014, 11:12
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38765850
NDAleksey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
NDAleksey
Участник
krvsaNDAlekseyзнаю, но дело принципа!)
Зачем вы так убиваетесь? Вы же так не убъетесь!!! (с)

зато я пробовал) просто скажите - это невозжомно? если да, то я умываю руки)
...
Рейтинг: 0 / 0
03.10.2014, 12:01
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38766011
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
NDAlekseyпросто скажите - это невозжомно?
Вот смотри...
У тебя явно табличный вывод - строки и две колонки...
Сами блоки на право и налево можно расставить, сделав их плавающими, левым и правым...
Но!
Они у тебя ещеи располагаются по вертикали, один вверху, другой внизу. Да еще высоту они ммеют "по контенту"...

Все прямо кричит - ЭТО ТАБЛИЦА! ТОЛЬКО В НЕЙ ТАКОЕ ДЕЛАЕТСЯ БЕЗ ПРОБЛЕМ!!!

Но тебе это видать не слышно - тебе нужно как-то иначе...
Остается вариант для маньяков - сделать все ДИВами, но дать им табличные свойства display:
- table
- table-row
- table-cell
...
Рейтинг: 0 / 0
03.10.2014, 13:15
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38766022
NDAleksey
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
NDAleksey
Участник
krvsaNDAlekseyпросто скажите - это невозжомно?
Вот смотри...


ну я просто версткой не занимаюсь, где-то лет 7 незад услышал, что таблица - зло для мобильных устройств, вот и избегаю таблицу) ну раз это не так, то ок, спасибо)
...
Рейтинг: 0 / 0
03.10.2014, 13:21
| Ответить | Цитировать | Написать  
Разнести 2 inline-block div-а по разным сторонам?
    #38766042
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
NDAlekseyгде-то лет 7 незад услышал, что таблица - зло для мобильных устройств
Опа!
...
Рейтинг: 0 / 0
03.10.2014, 13:32
| Ответить | Цитировать | Написать  
12 сообщений из 12, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Разнести 2 inline-block div-а по разным сторонам?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38765357&tid=1446660]:
 0ms
get settings:
 9ms
get forum list:
 16ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 56ms
get topic data:
 8ms
get forum data:
 3ms
get page messages:
 41ms
get tp. blocked users:
 1ms
others: 244ms
total:  384ms
созд. / загр.: 384ms
x
x
Закрыть


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