Не могу разобраться в теге div, нету времени. Подскажите пожалуйста, как можно оптимизировать этот код так, чтоб отображение было во всех браузерах со всеми разрешениями экрана одинаково: PHP: <style> div.l1 { color:white; background:green; margin-right:-2%; } </style> </head> <body bgcolor="#4c4c4c" link="white" vlink=#cacaca> <div class="l1"> <div style="margin-left:25%; margin-right:66%; margin-top:-1.3%; border-width:1%; border-color:white; border-style:solid; background:black;"> <font color="blue" size="6%">новости</font> </div> <div style="margin-left:40%; margin-right:53%; margin-top:-3.05%; border-width:1%; border-color:white; border-style:solid; background:black;"> <font color="blue" size="6%">книги</font> </div> </div>
все указано верно, доктайп есть. А где именно есть не закрытые теги? body не закрыт потому что я внизу ниче не копировал, head не открыт потому что доктайп и head и титлы тоже не скопированы.
Может канешн я чегонить не понимаю или не знаю, но вроде как принятно, что если взялся CSS использовать, так надо все в отдельном месте...а тэги style - это ЗЛО)) вообщем если я прально понял то как-то так: PHP: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <style> body{ margin: 0px; padding: 0px; background: #4c4c4c; } a {color: #FFFFFF;} a:hover {text-decoration: none;} div.li { color: #FFFFFF; background: #00AA00; } div.li div.li1{ margin: 0% 66% 0% 25%; border: 3px solid #FFFFFF; background: #000000; } div.li div.li2{ margin: 0% 53% 0% 40%; border: 3px solid #FFFFFF; background: #000000; } </style> </head> <body> <div class="li"> <div class="li1"> <a href="#">Новости</a> </div> <div class="li2"> <a href="#">Книги</a> </div> </div> </body> </html>
procedure, юзай Miicrosoft Expression WEb, это действительно вещь. Выставь доктайп командой, если гдето есть несовместимость со спецификацией то он тебе подчеркнет крассной линией. А еще проще, сделать табличную верстку и не морочить себе голову этой дрянью..
Зря ты так. Дело то не в просто или сложно, а в рациональности использования определенного подхода и в кроссбраузерности. Ни один знающий верстальщик не скажет, что таблицы - это полный отстой и их нельзя использовать. Просто на DIV более прозрачный код. И места меньше занимает.
procedure, проблема со стилем для тега div как я понял, у тебя написанно margin-right:-2%;, а эту конструкцию только IE понимает, остальные броузеры не схавают! Откажись от отрицательных величин!
В смысле "непутай людей" ? Я тебя не понял! Человек пишет, что проблемма с расположением элементов в разных броузерах, я советую отказаться от отрицательных велечин, так как их не все браузеры понимают.
раз эта тема поднялась, то не могли бы вы и мне не много помочь, мне требуеться, что бы рамки были расположены рядом, но если выставляю код один за другим, то они получаються друг под другом, как расположить их рядом? код рамки: HTML: <fieldset>
Как вариант, поместить их в таблицу: PHP: <table cellspacing="0" cellpadding="0"> <tr> <td><fieldset>A</fieldset></td> <td><fieldset>B</fieldset></td> <td><fieldset>C</fieldset></td> </tr> </table>
Вот другой вариант) PHP: <style> fieldset{ float: left; margin: 0px 4px; } </style> <fieldset>A</fieldset> <fieldset>B</fieldset> <fieldset>C</fieldset> Можно через <li> Сделать. Вообщем как больше нравится)
Понимаете, я просто попросил отредактировать мой код так, чтоб во всех браузерах или хотяб в опере и лисе показывал вид одинаково. А -2% чтоб верхняя рамка не была видна. И картинка как будто бы выходила свеху в будующем там все будет реализовано с помщью js. Кто поможет тому + max
Ты выложи код всей страницы и картинку как должно быть. А то так как у в разных браузерах поразному, то и не оч понятно, что ты хочешь получить?)
вот: PHP: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <style> body{ margin: 0px; padding: 0px; background: #4c4c4c; } a {color: #FFFFFF;} a:hover {text-decoration: none;} div.li { color: #FFFFFF; background: #00AA00; } div.li div.li1{ margin: 0% 66% 0% 25%; border: 3px solid #FFFFFF; background: #000000; } div.li div.li2{ margin: -1.8% 53% 0% 40%; border: 3px solid #FFFFFF; background: #000000; } </style> </head> <body> <div class="li"> <div class="li1"> <a href="#">Новости</a> </div> <div class="li2"> <a href="#">Книги</a> </div> </div> </body> </html> это в увеличенном виде страница. На глаз не ровности не видно. Но если поменять разршение. + в кнопках нужно чтоб рамка обтекала текст ровно. Даже при смене текста в кнопке. Что посоветуете делать?