Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Почему margin привязывается к соседнему контейнеру? / 3 сообщений из 3, страница 1 из 1
18.07.2009, 22:26
    #36097101
Свят
Свят
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему margin привязывается к соседнему контейнеру?
Почему margin привязывается к соседнему контейнеру, а не к родителю?
Вот код:
Код: plaintext
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.
<body style="margin:0; padding:0;">  
	
        <div id="body" style="width:1024px;border:1px solid black;position:relative">
            <table width="1000px" height="120px" cellspacing="10" border="1"  style="margin-left:12px;margin-top:12px;position:relative">
                <tr>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_1" />
                    </td>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_2" />
                    </td>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_3" />            
                    </td>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_4" />           
                    </td>
                </tr>
            </table>
            <div id="logo" style="width:1024px;height:90px;margin-left:0px;margin-top:134px;position:relative; border:1px double blue;">
                <jdoc:include type="modules" name="Main_Menu" />
            </div>
            <div id="authorization" style="width:1024px;height:36px;margin-left:0px;margin-top:224px;border:1px double red;">
                <jdoc:include type="modules" name="Authorization" />
            </div>
            <div id="Menu" style="width:236px;float:left;margin-left:22px;margin-top:260px; border:1px double blue;">
                <jdoc:include type="modules" name="Menu" />
            </div>
            <div id="content" style="width:733px;float:left; margin-right:22px;margin-top:260px;border:1px double blue;">
                <jdoc:include type="modules" name="Content" />
            </div>
            <div id="header_advertising" style="width:240px;height:36px;float:left;margin-left:22px;margin-bottom:244px;">
                <jdoc:include type="modules" name="Header_Advertising" />
            </div>
            <div id="other_news" style="width:494px;height:36px;float:left;margin-left:264px;margin-bottom:244px;">
                <jdoc:include type="modules" name="header_Other_news" />
            </div>
            <div id="news_partner" style="width:242px;height:36px;float:left;margin-left:758px;margin-bottom:244px;">
                <jdoc:include type="modules" name="header_News_partner" />
            </div>        
            <div id="flash_container" style="width:236px;height:200px;float:left;margin-left:22px;margin-bottom:34px; border:1px double blue;">
                <jdoc:include type="modules" name="Flash_container" />
            </div>
            <table id="other_news_content" width="462px" height="200px"  border="1" bordercolor="#00FF33" style="float:left;margin-left:280px;margin-bottom:34px;">
                <tr>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_5" />
                    </td>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_6" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_7" />
                    </td>
                    <td>
                        <jdoc:include type="modules" name="Graphic_text_block_8" />
                    </td>
                </tr>
            </table>	
            <div id="news_partner_content" style="width:232px;height:200px;float:left;margin-left:764px;margin-bottom:34px; border:1px double blue;">
                <jdoc:include type="modules" name="News_partner_content" />
            </div>
            <div id="footer" style="width:1024px;height:23px;float:left;margin-bottom:0px; border-top:1px solid #999999;">
                <jdoc:include type="modules" name="Footer" />
            </div>
        </div>
</body>

В ресультате просто бред получился, я делал привязку к краям div#body, а контейнеры привязалиь к краям друг друга :(
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
19.07.2009, 12:01
    #36097341
Свят
Свят
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему margin привязывается к соседнему контейнеру?
Нашел методом научного тыка что на margin влиет float, если его неустанавливать то margin привязываеться к соседям...
От така фигня малята...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
20.07.2009, 02:09
    #36097723
illion
illion
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Почему margin привязывается к соседнему контейнеру?
Свят,
метод тыка конечно хорошо, но в данном случае книжка по css была бы во сто крат эффективнее.

1. margin ни к каким соседям не привязывается. margin - это поле элемента, а не отступ элемента от родителя. Поэтому, если Вы для второго (третьего и т.д.) потомка задаете margin-top:30px, то это именно поле вокруг этого элемента, а не отступ от верха родителя.
То, что Вы пытались реализовать, делается обычно абсолютным позиционированием потомков (position:absolute; top:10px; left:50px, при условии, что у родителя задано position:relative), а не свободным перемещением (float).

2. float не влият на margin напрямую. float исключает элемент из нормального потока документа, что, в свою очередь, вносит коррективы в отображение элемента.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Почему margin привязывается к соседнему контейнеру? / 3 сообщений из 3, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 554ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1454499]:
 0ms
get settings:
 11ms
get forum list:
 21ms
check forum access:
 5ms
check topic access:
 5ms
track hit:
 209ms
get topic data:
 12ms
get forum data:
 3ms
get page messages:
 36ms
get tp. blocked users:
 1ms
others: 251ms
total:  554ms
x
x
Закрыть


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