Jump to content
  • 0

Несколько вопросов по верстке.


Frolov
 Share

Question

Добрый вечер.

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

Подопытный находиться здесь

1.Одинковая высота колонок сделана с применением margin и padding, но переодически наблюдаю глюк в опере (10.6х) Блоки не обрезаются, т.е идет сайт, а потом фон и в сумме нам это и дает 30 000пк в высоту. Хоят в большинстве случаев все отображается нормально, но все же не совсем приятно. Вот и не могу понять, то ли я где то накосячил, то опера тупит (в других браузерах вроде все норм.)

2. Небольшой недочет в хроме. Правый блок с рекламой (на главной) отображается без бордера, во всех остальных браузерах все нормально

3. Этот вопрос все таки задам завтра, после тлого как посмотрю на работе, как сайт отображается сайт в ие6, иетестеру уже не доверяю, т.к. реально код достаточно часто отображается не так, как в настоящем браузере.

Спасибо за внимание.

Link to comment
Share on other sites

Recommended Posts

  • 0
Страница не открывается (точнее я загрузки не дождался - ждал секунд 20).

Хм, я конечно понимаю что графику еще не адаптировал под веб и над этим можно поработать, но даже с моим каналом 1мбит/с, сайт грузиться за пару секунд.

klierik, в 1 и 2 описаны траблы, вопрос один, как лечить, догадаться не сложно вроде.

Edited by Frolov
Link to comment
Share on other sites

  • 0

Frolov,

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

учитесь правильно оформлять топы.

1. опера 10.60 - все окей.

2. бордера нету по причине марджина и падинга 30000пк. лечить просто - избавится от этих 30 000пк.

Link to comment
Share on other sites

  • 0

та епта.....в опере эта хрень есть, страница высотой в 30 000пк.....

Есть подозрения на вставленные яндекс-директ и счетчики....

Ведь можно наверно как то этот глюк починить....

http://global-stroy.net/

Link to comment
Share on other sites

  • 0

щас попробую.....но хз

Вчера ради интереса переверстал структуру, т.к по ходу та вносились изменения и можно было упростить верстку. Заверстал, забил контентом типа

а<br />а<br />а<br />а<br />а<br />а<br />

Проверил во всех арбузерах, держит, нчего не рушится.

Далее самое интересное....

Начинаю переносить содержимое с оригинала...Перенес хедер, все держит....)))

Потом взялся за колонки. Вставил контент в одну из них....хрена!! Уплыло...методом исклбчения добрался на что там такая реакция....на блоки с заголовками, точнее на div с скруглением элементов (картинкой)

<div class="bg-left">l</div>
<div class="bg-right">r</div>

Они там позиционируются внутри div.title И все выполнено по всем правилам жанра.....реакция :)

Потом еще нашел ряд таких "закономерностей".........

Всерьез подумываю переделать каркас на таблицы.....

П.С. Если кто будет смотреть код стрнаце, то смотреть здесь, там уже внесены изменения, с которыми эксперементировал на макете....

На работе тогда посмотрю что там за реакция на div.content, тогда и отпишусь.

Link to comment
Share on other sites

  • 0
Вот решение без отрицательного маргина.

Да я знаком с этим способом, правда его не использовал. Но мн помимо фона нужен еще и бордер, На том коде это вроде не реализуеш. Правла волкер уже делал решения для подобных колонок + скругленные углы, но это ж капец....те более учитывая что на этом сайте еще надо использовать вложеннсоть подобных тянущихся блоков. Наверно щас на таблицы + дивы переверстаю, как бы я не любил таблицы для построения каркаса, но это уж точно не поплывет

Link to comment
Share on other sites

  • 0

Дивы в принципе не приспособлены для 100% высоты и одинаковых колонок. Это надо понимать. Переносить идеологию табличной верстки на блочную глупо. Так что верстайте таблицами и не парьтесь. Как говорится, ничего не стыдно, что юзеру видно.

Link to comment
Share on other sites

  • 0

если версткой разруливать то я бы делал задействовав еще несколько блоков. Если интересует пример могу дать в аське.

или табличка.

Если джс - могу дать свой джс. Уже писал для таких целей. На чистом джс

Вижу что уже сделал табличкой. Ну так все же работает, что еще нужно? Нормальное решение :)

Edited by mishka2
Link to comment
Share on other sites

  • 0
Это такой костыль устаревший для прибивания футера к низу.

Вот здесь решение более красивое, без всяких 3000000000000 пикселов.

http://www.webmolot.com/recipe/footer/

Да хорошое решение, только если менять размер окна браузера по вертикали, то футер постоянно залипает, то посреди окна то ещё где :)

Link to comment
Share on other sites

  • 0
Да хорошое решение, только если менять размер окна браузера по вертикали, то футер постоянно залипает, то посреди окна то ещё где :)

ты просто смотришь в опере, это у нее баг такой.

На самом деле это самый нормальный способ прибивания футера.

Edited by mishka2
Link to comment
Share on other sites

  • 0

Да, да, это снова я, с убитым напрочь мозгом....

Добрый вечер.

Незнаю почему, но снова возник этот трабл с растягиванием страницы. Вроде ничего из стилей для этого элемента не правил.....было все нормально....тыркал, тыркал, так и не понял что такое. Потом решил протестировать один вариант, убрал скругление у плашек - заголовков (они там позиционируются) и вроде бы нормально стало....

В итоге имеем, сайт с скругленнми плашками, страницу тянет http://mirror-u9362.netangels.ru/

И второй вариант, с убранным скруглением http://www.global-stroy.net/

Даже не знаю что дальше делать.

1. Искать как лечить вариант с скругленными углами, не трогая структуры

2. Менять стркутура блока content, но слабо представляю что там еще заюзать можно

3. Убрать нафиг скругление и оставить так или изменить вид.

Идеи буду?))

Edited by Frolov
Link to comment
Share on other sites

  • 0

ты бы не тыкал в меня для начала.

???

	div.columns-three-left,
div.columns-three-right,
div.columns-three-center {
border-right: 5px solid rgb(250,250,250);
padding-bottom: 30000px;
margin-bottom: -30000px;
}


/********************************************************************************
*********/
/* TWO COLUMNS STYLE */
/********************************************************************************
*********/
table.wrapper div.columns-two-left {
border-right: 5px solid rgb(250,250,250);
width: 50%;
float: left;
padding-bottom: 30000px;
margin-bottom: -30000px;
}

table.wrapper div.columns-two-right {
overflow: hidden;
padding-bottom: 30000px;
margin-bottom: -30000px;
}

Link to comment
Share on other sites

  • 0

Оу, извините пожалуйста, к Вам обращаться на Вы или Ваше Величество или как то еще? Можете указать это в подписи своей, что бы небыло недоразумений в будущем?

По топику. Гениально!

div.wrapper div.content {
padding-bottom: 30000px;
margin-bottom: -30000px;
...
}

Кажется в том пост речь шла об этом элементе или у меня плохо со зрением. И этот элемену уже присвоены другие свойства, да и вообще теперь это ячейка таблицы, а не див. Это раз.

 table.wrapper div.columns-two-left {
border-right: 5px solid rgb(250,250,250);
width: 50%;
float: left;
padding-bottom: 30000px;
margin-bottom: -30000px;
}

table.wrapper div.columns-two-right {
overflow: hidden;
padding-bottom: 30000px;
margin-bottom: -30000px;
}

А то я не понимаю для чего это надо и что это делает.

1. При нормальных условиях (описан случай где используются плащки без скругления) верстка в опере вроде бы как и не едет, так что глупо писать что это надо убрать. Тут вопрос в том как заставить эту верстку не расползаться при любом контенте внутри.

2. Если уж предложил снести все это дело, то предложи как заменить данный хак можно. Лично у меня идей по по реализации данной замены нет.

В итоге, смысл в твоих постах отсутствует напрочь.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy