внутренний div проходит за пределами внешнего div

0

У меня есть внутренний DIV, который продолжает прохождение вне родительского div только внизу. Я не хочу менять настройки mobileArea как часть моего Dreamweaver FGL.css

CSS:

#mobileArea {
clear: both;
float: left;
margin-left: 0;
margin-top: -1252px;
width: 100%;
width: calc(100% - 10px);
height: 830px;
display: block;
}

.mobileContent{
display: block;
height: auto;
margin-left:2px;
margin-right:2px;
margin-bottom: 0px;
overflow-y: auto;
overflow-x: hidden;
border: solid;
border-color: #1D7C06;
 }

Я пробовал каждую комбинацию вещей (кроме правильной вещи) и не могу понять, почему margin-bottom не работает. Уверен, это очень просто, но я не могу найти много похожих сообщений.

Настроить

<div id="mobileArea">
   <div id="logo">  No Set Height as it needs to change in size</div>
   <div id="links"> No Set Height as it needs to change in size</div>
   <div id="content" class="mobileContent">displays after links on a new line OK, 
       but continues out of parent div.</div>
</div>
  • 0
    Во-первых, это должно быть id="mobileArea" вместо name=....
  • 0
    Возможно, вы могли бы создать живой пример на сайте, таком как jsfiddle.net, который поможет отличить, если ошибки, как Maxime только что указал (и вы все еще ошибаетесь - у вас есть # в атрибуте id= ), являются источником вашей проблемы или просто ошибки в примере.
Показать ещё 3 комментария
Теги:
height

3 ответа

2

Я думаю, что Missing Id - это просто TYPO

удалить несколько свойств css

#mobileArea {
 **clear: both;**Remove this line
 ....
 ....

 }

надеюсь, что это сработает

Поделиться
  • 0
    (y) вы обновили имя до id..Хорошо
  • 0
    К сожалению удаление ясно, не добилось цели
0

Это ваш сайт? - http://www.allcoles.com/

Это фиксирует положение и делает мобильную главную область прокручиваемой областью:

.mobileContent - remove position:absolute
#mobileMainArea - overflow:scroll;

Конечно, вы хотели бы бросить это в медиа-запрос, так как это выглядит так, как разрывы страниц на 706px вы можете сделать:

@media all and (max-width: 706px){
    .mobileContent - remove position:absolute
    #mobileMainArea - overflow:scroll;
}

Надеюсь, я правильно понял ваш вопрос.

Поделиться
  • 0
    Спасибо, Марио, я добился определенного прогресса, выполняя то, что хочу. Изменив значение mobileContent на абсолютное, а снизу на 0pt, мне пришлось изменить mobileMainArea на относительное. Это остановило его переполнение вниз, нет, я просто должен был разобраться, как остановить его перетекание на ссылки и логотип в мобильных размерах
  • 0
    Удалите следующее .mobileContent - положение, внизу, слева, справа, сверху. И добавьте следующее в #mobileMainArea - overflow-y: scroll;
Показать ещё 3 комментария
0 
#mobileArea {
    overflow: scroll;

Стиль CSS для overflow должен применяться к mobileArea а не к дочернему div.

Поделиться
  • 0
    прочитайте мой ответ, сеньоро!
  • 0
    Внутри моего ребенка div еще больше div. Поэтому я требую, чтобы у дочернего элемента div был свиток.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню