проблема с div'ами

Тема в разделе "Веб-дизайн", создана пользователем SimonSmith, 1 фев 2011.

Модераторы: zek24
  1. SimonSmith

    SimonSmith Постоялец

    Регистр.:
    25 сен 2008
    Сообщения:
    148
    Симпатии:
    33
    HTML:
    <html>
    <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(document).ready(function() {
    	$("div#menutitle5").click(function () {
          $("div#info5").slideToggle("slow");
        });
    	$("div#menutitle4").click(function () {
          $("div#info4").slideToggle("slow");
        });
    });
    </script>
    <style>
    .info { display:none; width:343px; border:1px solid #dedede; background:white; margin-left:10px; margin-bottom:10px; border-top:0; }
    .others { height:41px; margin-top:10px; margin-left:10px; width:345px; }
    .top { width:343px; border:1px solid #dedede; background:white; margin-top:10px; margin-left:10px; padding-top:30px; }
    </style>
    </head>
    <body>
    <div style="border:1px solid black; width:800px;">
    		<div style="float:left;">	
    			<div class="top">abc</div>
    			<div id="menutitle5" class="others"><span  style="color:#035f92; font-weight:bold; padding-top:11px; display:block; padding-left:15px;">Left:</span></div>
    			<div id="info5" class="info" align="center">
    				<br>1<br>2<br>3<br>
    			</div>
    		</div>
    		<div style="float:right;">	
    			<div class="top">abc</div>
    			<div id="menutitle4" class="others"><span  style="color:#035f92; font-weight:bold; padding-top:11px; display:block; padding-left:15px;">Right:</span></div>
    			<div id="info4" class="info" align="center">
    				<br>1<br>2<br>3<br>
    			</div>
    		</div>
    </div>	
    </body>
    </html>
    В результате у меня то что внутри первого дива не обводится черной рамкой...если уберу флуат то все норм но мне надо распределить блоки в таком порядке, один с право, другой с лево... Почему все так происходит?

    Добавлено через 11 минут
    сори:
    решил проблему, добавил в первый див position:absolute; хотя толком и не понимаю для чего все это но помогло...не помогло только в ИЕ и за того что использую посторонний скрипт для border-radius :confused:
     
  2. bork75

    bork75 The Team

    Регистр.:
    21 июн 2008
    Сообщения:
    1.450
    Симпатии:
    717
    Нужно писать в каком браузере проблема, я так понял в Мозиле, в других нормально.

    Нужно добавить height
    PHP:
    <div style="border:1px solid black; width:800px; height:200px;">
     
  3. SimonSmith

    SimonSmith Постоялец

    Регистр.:
    25 сен 2008
    Сообщения:
    148
    Симпатии:
    33
    Ув. bork75 проблема была в ИЕ (да и вообще она глобальная проблема. для всех браузеров))... но еще зачем ставить высоту если хочу что бы высота определялась когда слайды открываются и закрываются...

    еще проблему решил с удаление дива с границей и добавление всех элементов в таблицу...но в этом примере хотел чисто использовать дивы без таблиц...но видимо никак...(
     
  4. Kub

    Kub

    Регистр.:
    5 июн 2009
    Сообщения:
    623
    Симпатии:
    483
    Основной div в котором для плавающих просто схлопывается и рамку поэтому не видно.
    Попробуйте overflow:hidden прописать вместо height:200px так
    PHP:
    <div style="border:1px solid black; width:800px; overflow:hidden;">
    Вот здесь ближе к концу написано про схлопывание блока в котором есть плавающие блоки Перейти по ссылке