div - разное отображение в браузерах

Ответить
Аватара пользователя
kastoff

div - разное отображение в браузерах

Сообщение kastoff »

Делаю сайт, верстка на div, не могу понять почему в ослике и опере отображается нормально, в firefox выпадают блоки. Помогите советом, просмотреть можно oneline.kz



код странички




Цитата:











первая
.
новости
.
главное
.
бизнес
.
в мире
.
проишествия
.
общество
.
культура
.
спорт
.
автоновости
.
блоги
{banner_top}





Изображение











Изображение



{custom category="1" template="news" aviable="global" from="2" limit="6" cache="no"}


| [url=http:/index.php.htm]Index[/url] | « на первую


















Изображение



{custom category="2" template="newsfull" aviable="main" from="0" limit="1" cache="no"}

{custom category="2" template="news1" aviable="main" from="1" limit="3" cache="no"}









Изображение



Изображение



{custom category="3,4,5,6" template="03_biss" aviable="main" from="0" limit="4" cache="no"}









Изображение







{custom category="8" template="sport" aviable="main" from="1" limit="5" cache="no"}















{custom category="8" template="newsfull" aviable="main" from="0" limit="1" cache="no"}









Изображение







{custom category="9" template="sport" aviable="main" from="1" limit="5" cache="no"}















{custom category="9" template="newsfull" aviable="main" from="0" limit="1" cache="no"}









CSS


Цитата:



body {font-family: Verdana, Arial, Helvetica, sans-serif; margin-top: 0px; font-size: 10px; line-height: 15px;}



ul {

list-style-type: none;

margin-top: 0px;

margin-left: 0px;

text-indent: 0px;

padding-left: 0px;

}



div#main_box {

margin-left: 65px;

margin-right: 65px;

width: 850px;

}



div#header_headline {

width: 850px;

height: 104px;

border: 0px;

}



div#header_subline {

width: 850px;

height: 131px;

clear: both;

}



div#header_box1 {

height: 104px;

width: 850px;

}



div#txt_line {

width: 850px;

height: 47px;

}



div#spalte_links {

float: left;

width: 310px;

}



div#box_readme {

width: 310px;

}



div#m001 {

float: left;

height: 109px;

width: 50px;

margin-top: 19px;

}



div#readme {

width: 260px;

margin-top: 15px;

float: right; /* text-align: justify; */

}



div#readme1 {



margin-top: 15px;

float: right; /* text-align: justify; */

}



div#txt_categories {

width: 310px;

height: 13px;

clear: both;

padding-top: 30px;

}



div#box_categories {

width: 310px;

float: right;

}



div#txt_archives {

width: 310px;

height: 13px;

clear: both;

padding-top: 30px;

}



div#box_archives {

width: 310px;

float: right;

}



div#txt_imprint {

width: 310px;

height: 13px;

clear: both;

padding-top: 30px;

}



div#box_imprint {

width: 310px;

float: right;

}



div#imprint {

width: 220px;

margin-top: 15px;

float: right;

}



div#logo {

float: left;

height: 109px;

width: 50px;

margin-top: 19px;

}



div#archives {

width: 260px;

margin-top: 15px;

float: right;

}



div#categories {

width: 260px;

margin-top: 15px;

float: right;

}



div#spalte_rechts {

width: 530px;

float: right;

}



div#box_projection {

width: 530px;

}



div#m002 {

float: left;

height: 109px;

width: 50px;

margin-top: 19px;

}



div#projection {

width: 480px;

height: 230px;

float: right;

margin-top: 19px;

}



div#txt_gpc_production {

width: 530px;

height: 13px;

padding-top: 30px;

clear: both;

}



div#txt_gpc_glavnoe {

width: 530px;

height: 13px;

padding-top: 20px;

clear: both;

}



div#box_gpc_production {

width: 530px;

float: right;

}



div#m003 {

float: left;

height: 109px;

width: 50px;

margin-top: 19px;

}



div#production {

width: 480px;

margin-top: 17px;

float: right;

}

div#production_1 {

width: 530px;

margin-top: 17px;

float: right;

}

div#production1 {

width: 480px;

margin-top: 17px;

float: right;

}

div#production2 {

width: 480px;

margin-top: 3px;

float: right;

}



div#production3 {

margin-top: 3px;



}



div#txt_affiliates {

width: 530px;

height: 13px;

padding-top: 30px;

clear: both;

}



div#box_affiliates {

width: 530px;

float: right;

}



div#m004 {

float: left;

height: 109px;

width: 50px;

margin-top: 19px;

}



div#affiliates {

width: 440px;

margin-top: 17px;

float: right;

}



div#txt_connected {

width: 530px;

height: 13px;

padding-top: 30px;

clear: both;

}



div#box_connected {

width: 530px;

float: right;

}



div#connected {

width: 440px;

margin-top: 17px;

float: right;

}



div#txt_contact {

width: 530px;

height: 13px;

padding-top: 30px;

clear: both;

}



div#box_contact {

width: 530px;

float: right;

margin-bottom: 30px;

}



div#contact {

width: 440px;

margin-top: 17px;

float: right;

}



div#readmetxt {

margin-top: 0px;

margin-bottom: 25px;

}



div.postings {

margin-top: 0px;

margin-bottom: 25px;

}



h1 {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

line-height: 15px;

font-weight: bold;

color: #3B303F;

margin-top: 0px;

}



h2 {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

line-height: 15px;

font-weight: bold;

color: #3B303F;

margin-top: 0px;

margin-bottom: 15px;

}

/* Îòîáðàæåíèå çàãîëîâêà íîâîñòè */

.in {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 15px; font-weight: bold; color: #FF007E; margin-top: 0px; margin-bottom: 0px;}

.in a:active, .in a:visited, .in a:link { color: #FF007E; text-decoration: none;}

.in a:hover {color: #3B303F; text-decoration: none;}



.min {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 15px; font-weight: bold; color: #3B303F; margin-top: 0px; margin-bottom: 0px;}

.min a:active, .min a:visited, .min a:link { color: #3B303F; text-decoration: none;}

.min a:hover {color: #FF007E; text-decoration: none;}



.stextf {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 15px; font-weight: bold; color: #3B303F; margin-top: 0px; margin-bottom: 0px;}

.stextf a:active, .stextf a:visited, .stextf a:link { color: #3B303F; text-decoration: none;}

.stextf a:hover {color: #FF007E; text-decoration: none;}



.stext {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px; line-height: 15px; color: #777777; margin-top: 0px; margin-bottom: 0px;}

.stext a:active, .stext a:visited, .stext a:link { color: #777777; text-decoration: none;}

.stext a:hover {color: #FF007E; text-decoration: none;}







.glav {FONT-WEIGHT: bold; color: #222222; FONT-SIZE: 10px; text-decoration: none; padding-left: 10px; margin-top: 0px; margin-bottom: 0px;}

.glav a:active, .glav a:visited, .glav a:link { color: #222222; text-decoration: none;}

.glav a:hover {color: #ffffff; text-decoration: none;}

.alignleft {float: left;}

.alignright {float: right; color: #cccccc; FONT-SIZE: 10px; padding-right: 10px; azimuth:}



h3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 15px; font-weight: bold; color: #3B303F; margin-top: 0px; margin-bottom: 0px;}



p {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

line-height: 15px;

color: #3B303F;

margin-top: 0px;

}

.fulltxt {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 11px;

line-height: 15px;

color: #3B303F;



}



span.marker1 {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

line-height: 15px;

color: #ffffff;

background-color: #d7d7d7;

}



span.marker2 {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

line-height: 15px;

color: #ffffff;

background-color: #3B303F;

}



input {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

width: 480px;

background-color: #FFFFFF;

color: #3B303F;

border-top: 1px #3B303F solid;

border-right: 1px #3B303F solid;

border-bottom: 1px #3B303F solid;

border-left: 1px #3B303F solid;

margin-bottom: 5px;

}



textarea {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

width: 480px; height: 140px;

background-color: #FFFFFF;

color: #3B303F;

border-top: 1px #3B303F solid;

border-right: 1px #3B303F solid;

border-bottom: 1px #3B303F solid;

border-left: 1px #3B303F solid;

margin-bottom: 5px;

}





input.search {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

width: 220px;

background-color: #FFFFFF;

color: #3B303F;

border-top: 1px #3B303F solid;

border-right: 1px #3B303F solid;

border-bottom: 1px #3B303F solid;

border-left: 1px #3B303F solid;

margin-bottom: 5px;

}



select {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

width: 220px;

background-color: #FFFFFF;

color: #3B303F;

border-top: 1px #3B303F solid;

border-right: 1px #3B303F solid;

border-bottom: 1px #3B303F solid;

border-left: 1px #3B303F solid;

margin-bottom: 5px;

}

.quote{font: 11px/15px normal helvetica, sans-serif;

margin-top: 10px;

margin-bottom: 10px;

margin-left: 30px;

padding-left: 15px;

border-left: 3px solid #FF007E; color:#666666;



}

input.contact {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

width: 480px;

background-color: #FFFFFF;

color: #3B303F;

border-top: 1px #3B303F solid;

border-right: 1px #3B303F solid;

border-bottom: 1px #3B303F solid;

border-left: 1px #3B303F solid;

margin-bottom: 5px;

}



textarea.contact {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

width: 480px;

background-color: #FFFFFF;

color: #3B303F;

border-top: 1px #3B303F solid;

border-right: 1px #3B303F solid;

border-bottom: 1px #3B303F solid;

border-left: 1px #3B303F solid;

margin-bottom: 5px;

}



A:link {

color: #3B303F;

text-decoration: none;

}

A:visited {

color: #3B303F;

text-decoration: none;

}

A:active {

color: #3B303F;

text-decoration: none;

}

A:hover {

color: #3B303F;

text-decoration: underline;

}





a.m1:link {

color: #3B303F;

text-decoration: underline;

}

a.m1:visited {

color: #C1C1C1;

text-decoration: none;

}

a.m1:active {

color: #C1C1C1;

text-decoration: none;

}

a.m1:hover {

color: #ffffff;

background-color: #3B303F;

text-decoration: none;

}



a.news:link {

color: #3B303F;

text-decoration: underline;

}

a.news:visited {

color: #C1C1C1;

text-decoration: none;

}

a.news:active {

color: #C1C1C1;

text-decoration: none;

}

a.news:hover {

color: #ffffff;

background-color: #3B303F;

text-decoration: none;

}



a.head:link {

border: 0px;

text-decoration: none;

}

a.head:visited {

border: 0px;

text-decoration: none;

}

a.head:active {

border: 0px;

text-decoration: none;

}

a.head:hover {

border: 0px;

text-decoration: none;

}



/* ==================== Êàëåíäàðü */



.weekday-active-v {

color: #4b73d4;

}

.day-active-v {

color: #FF007E;

}

.calendar {



color: #303030;

font-family: verdana;

font-size: 10px;



}

.calendar td, th {

font-family: verdana;

text-decoration: none;

/* - */

padding-left: 10px;

padding-right: 4px;

padding-top: 3px;

padding-bottom: 4px;

/* - */

}

.weekday {

color: #FF007E;

font-family: verdana;

}

.weekday-active {

color: #FF007E;

font-family: verdana;

}

.day-active {

color: #FF007E;

font-family: verdana;

}

.day-active a, .weekday-active a, .day-active-v a, .weekday-active-v a {

text-decoration: underline;

}

.monthlink {

color: #5078d6;

text-decoration: none;

}



/* êîììåíòàðèè */

.bord {

border: 1px; border-color: #000000; border-style: solid;

}

.bordbot {

border-bottom: 1px; border-bottom-color: #000000; border-bottom-style: solid;

}

.comm {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px; line-height: 15px; color: #777777; padding-left: 10px ; margin-top: 0px; margin-bottom: 0px;}

.comm10{

padding: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 15px; color: #333333;}



.404 {

font-size: 30px;

font-weight: bold;

}



выручайте, что не так?
Аватара пользователя
bruder

Re: div - разное отображение в браузерах

Сообщение bruder »

структура запутанна и если вы даете id, то они должны быть однозначны и не повторятся, в противном случае используйте классы. А в каком месте выпадают блоки, не вижу разницы?
Аватара пользователя
bruder

Re: div - разное отображение в браузерах

Сообщение bruder »

Цитата kastoff:



div#txt_line
div - разное отображение в браузерах




Как по мне интересная форма записи дива.. =/ Я так не делаю, и не советую.. А если нужно стиль во стиле (так сказать див в диве) то как сказал bruder, действительно лучше через классы... Т.е. другими словами выглядит это так:

#name_id {}

#name_id .name_class {}

После чего..









PS: Не люблю я дивы, особенно в них {position:absolute;}....
Ответить

Вернуться в «Вебмастеру»