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=38765201&tid=1446660]:
 0ms
get settings:
 9ms
get forum list:
 14ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 49ms
get topic data:
 9ms
get forum data:
 2ms
get page messages:
 52ms
get tp. blocked users:
 2ms
others: 220ms
total:  363ms
созд. / загр.: 363ms
x
x
Закрыть


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