Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.05.2014, 23:15
Новичок на форуме
Отправить личное сообщение для maboz Посмотреть профиль Найти все сообщения от maboz
 
Регистрация: 26.05.2014
Сообщений: 1

Исчезает div в браузере Chrome
Добрый вечер.
При уменьшении окна браузера chrome, .sidebar (на определенном этапе) перестает отображаться.
В firefox все ок(.sidebar не исчезает) и при уменьшении окна появляется горизонтальный скролл. Как добиться того же и для chrome ?

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
html, body {
	margin: 0;
	color: #000;
	background: #CCC;
}

.container {
	float: left;
	max-width: 750px;
	min-width: 550px;
	margin-right: 250px;
	background: #FFF;
}

.sidebar {
  float:left;
	margin-left: -250px;
	width: 250px;
	background-color: #444;
	color: #FFF;
}

</style>
</head>
<body>

<div class="container">Небольшой размер и простота их грамматик, а также возможность изучать полное множество высказываний, порожденных на таких языках, делают их идеальными модельными объектами для тестирования моделей усвоения языка.</div>
<div class="sidebar">Но языки поисковых запросов отошли от родительских и обзавелись наборами идиом</div>

</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 08.07.2014, 09:45
Новичок на форуме
Отправить личное сообщение для montukxd Посмотреть профиль Найти все сообщения от montukxd
 
Регистрация: 08.07.2014
Сообщений: 5

margin-left и margin-right вам не нужны

.container {
	float: left;
	max-width: 750px;
	min-width: 550px;
	background: #FFF;
}

.sidebar {
  float:left;
	width: 250px;
	background-color: #444;
	color: #FFF;
}
Ответить с цитированием
  #3 (permalink)  
Старый 08.07.2014, 09:47
Новичок на форуме
Отправить личное сообщение для montukxd Посмотреть профиль Найти все сообщения от montukxd
 
Регистрация: 08.07.2014
Сообщений: 5

ну или уберите min-width: 550px; в контейнере.
Ответить с цитированием
  #4 (permalink)  
Старый 09.07.2014, 14:32
Аватар для hfts_rider
Профессор
Отправить личное сообщение для hfts_rider Посмотреть профиль Найти все сообщения от hfts_rider
 
Регистрация: 26.01.2014
Сообщений: 181

На данный момент у тебя блок падает вниз и уезжает на -250 влево, из-за этого ты его и не видишь.

Убери "margin-left: -250px;" и никогда так не делай)

Тебе нужно задать конкретный размер блоков, или в пикселях, или в процентах(если хочешь что бы был резиновый) и тогда все будет ровно.
или сделай левый блок без float, а правый поставь float: right; и поменяй их местами что бы тот у кого стоит float был выше в дереве.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывести на печать DIV как его видно в браузере (с учетом фона с стилей) unomomento Элементы интерфейса 4 28.12.2013 00:43
Проблемы с div обновлённым через (#id).load erlcat jQuery 4 03.03.2013 03:41
высота div и Google Chrome Elvis Javascript под браузер 7 16.09.2012 17:12
JQuery, keypress в браузере google chrome Flake jQuery 1 09.03.2012 16:06
проблема с div И animate g00000dman jQuery 2 24.03.2011 23:34