Очень странный баг

qwestpool · March 22, 2014

Такой код:

<!DOCTYPE html><html><head>	<meta charset="utf-8" />	<link rel="stylesheet" type="text/css" href="styles/photon.css" /></head><body><form >	<input/> 	<input/>	<input/></form><div style="border-top: 1px solid black;" ></div> <!-- РАЗДЕЛИТЕЛЬ --><div>	<span>		ТЕСТ	</span>	<div class="test">		ТЕСТ 2	</div>	</div></body></html>

.test {float: right;}

Проблема заключается в следующем, div с текстом "ТЕСТ 2" в FireFox отображается на одной строке с div'ом с текстом "ТЕСТ", а в Chrome и Opera почему-то съезжает на одну строку вниз. Методом исключения (постепенно поудалял все лишнее со страницы) я обратил внимание связь этого с формой состоящей из трех inputo'в, если удалить хоть один инпут или всю форму, то второй div возвращается на ту же строку что и первый, но как это может быть связано? Я просто ума не приложу.

Вторую странность я обнаружил когда хотел перенести все стили в html-файл, чтобы вам было удобней читать код. В общем, если перенести из внешнего файла свойство float прямиком в тег div'а (<div style="float: right;">) то div тоже начинает отображаться на нужной строке, но как только я опять пытаюсь подключить стиль из внешнего файла, то он опять съезжает.

Объясните, это я идиот или это какой-то баг?

Файлы не стал помещать в архив чтобы никто не боялся что там вирус, поэтому скачайте отдельно:

html: http://rghost.ru/53262091

css: http://rghost.ru/53262102

kattiperk · March 22, 2014

float вообще плохая штука.

по возможности лучше избегать их.

но суть вопроса? должно быть на одной строке тест и тест2?

и ещё, есть такая штука, как jsfiddle.net. вот там можно код для всех шарить.

у меня всё в порядке. много инпутов=флоат срабатывает, мало инпутов=флоат срабатывает.

и с переносом, то лучше избегать этого также. подключать css внешне, удобнее и нагляднее.

kattiperk · March 23, 2014

спасибо за минус)

CroaToa · March 23, 2014

float вообще плохая штука. по возможности лучше избегать их.

Я не ставил минус, но очень волнует меня вот эта цитата. Насколько я понял, все сайтостроение сейчас идет с float-ом, если это не так, то значит я до сих пор ничего не понял.

DragorWW · March 23, 2014

float вообще плохая штука. по возможности лучше избегать их.
Я не ставил минус, но очень волнует меня вот эта цитата. Насколько я понял, все сайтостроение сейчас идет с float-ом, если это не так, то значит я до сих пор ничего не понял.

что на локальных файла что в http://jsfiddle.net/DragorWW/9GYGv/ всё работает как надо.

И скорее всего это некорректное поведение связанно с переопределением float чем то.

Вообще если сможешь на jsfiddle залить пример который не работает, то мы сможем тебе помочь.

и да float по факту не сильно то и нужен меня спасают inline-block и table-cell

ну и да ещё clearfix.

kattiperk · March 23, 2014

float вообще плохая штука. по возможности лучше избегать их.
Я не ставил минус, но очень волнует меня вот эта цитата. Насколько я понял, все сайтостроение сейчас идет с float-ом, если это не так, то значит я до сих пор ничего не понял.

вот человек постом ниже выразил моё недоразумение.

тот див не так важен со своим флоатом. вот это надёжнее inline-block и table-cell

как же трудно мне выражать свои мысли) давайте я вам рисовать буду, это лучше выходит, чем говорить)))

Николя223 · March 24, 2014

тот див не так важен со своим флоатом. вот это надёжнее inline-block и table-cell

не всегда. До сих пор замечаю несущественные баги в table-cell .

Sign In

Очень странный баг

Question

qwestpool

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

kattiperk

Link to comment

Share on other sites

kattiperk

Link to comment

Share on other sites

CroaToa

Link to comment

Share on other sites

DragorWW

Link to comment

Share on other sites

kattiperk

Link to comment

Share on other sites

Николя223

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information