Autor Zpráva
Majinka
Profil
#1 · Zasláno: 14. 3. 2007, 16:52:10 · Upravil/a: Majinka
Odpovědět Citovat
ahojík mám jeden problém a nevím jak to spravit .Mám stránky s pozicováním pomocí stylů.Když to otevřu v IE vše je ok ,ale když to otevřu v Opeře nebo v Mozille posune se mi to:( Nevím co s tím!
moje stránka [url=http://mujwebikzjok.czweb.org/
]http://mujwebikzjok.czweb.org/
[/url]

body{background-color: #6C6EFF;}
div#hlavicka{position: absolute;
top: 65px;
left: 70px;
right: 85px;
width: 850px;
height: 110px;
border-left: 7px double black;
border-right: 7px double black;
background: #A52A2A;}

div#obsah{position: absolute;
top: 175px;
left: 70px;
height: 600px;
width: 195px;
font-size: 190px;
border-left: 7px double black;
background: #EDB9B9;}

div#hlavni{
position: absolute;
top: 175px;
left: 265px;
right: 85px;
text-align: left;
height: 600px;
width: 655px;
background-color: #FFECEC;
border-right: 7px double black;
float: right;}

div#patka{
left: 30px;
right : 30px;
width: 920px;
top:700px;
font-size : 80%;
text-align : center;
color: white;}

h3{ margin: 15px 10px 15px 0px;
font-weight: bolder;
color: Black;
padding: 0px 0px 0px 10px;
font-family: "Copperplate Gothic Light";
font-style: normal;
font-size: 16pt;
text-align: center;}

h4{ margin: 15px 100px 15px 100px;
font-size: 110%;
font-weight: 400;
color: #FF6347;
padding: 0px 0px 0px 10px;
text-align: center;
font-weight: bolder;
text-align: center;}

A také nevím co s patičkou,jak mám docílit toho aby se automaticky přilepila těsně pod hlavní obsah?
Předem moooc děkuju za radu:)
havs
Profil
#2 · Zasláno: 14. 3. 2007, 17:41:02
Odpovědět Citovat
Opera (podle mě správně) pozicuje v objektu, tedy v body. Začal bych:
body { padding: 0; margin: 0; }
Majinka
Profil
#3 · Zasláno: 14. 3. 2007, 20:55:22
Odpovědět Citovat
a co s tím dál???
Davex
Profil
#4 · Zasláno: 14. 3. 2007, 21:20:57
Odpovědět Citovat
Je špatně ten stylopis, pod koncem div#patka je jedna přebytečná uzavírací závorka.
Majinka
Profil
#5 · Zasláno: 14. 3. 2007, 21:47:20
Odpovědět Citovat
a jo :) už jsem to opravila....
Majinka
Profil
#6 · Zasláno: 15. 3. 2007, 14:12:11
Odpovědět Citovat
ale tím se to stejně naspraví....
Davex
Profil
#7 · Zasláno: 15. 3. 2007, 15:27:54
Odpovědět Citovat
Co se konkrétně nespraví? Zkus se zbavit absolutního pozicování a předělat to na plovoucí layout pomocí float: left.
Majinka
Profil
#8 · Zasláno: 15. 3. 2007, 21:23:22
Odpovědět Citovat
pořád ten stejnej problém jako na začátku ,když to otevřu v Opeře nebo v Mozille ten hlavní blok se posune:(
habendorf
Profil
#9 · Zasláno: 15. 3. 2007, 21:55:17
Odpovědět Citovat
left: 265px;
right: 85px;

Co je to za blbost?

Taky nechápu smysl floatování něčeho s position:absolute.
ladik
Profil *
#10 · Zasláno: 16. 3. 2007, 04:54:36
Odpovědět Citovat
Problém způsobuje rozdílné zobrazování padding a border v různých prohlížečích, FF a Opera dle specifikace, IE v každé verzi tak nějak jinak ...

Nějaké chyby:
- DOCTYPE, pokud je v HTML uváděn, patří na úplně první řádek ještě před "html"
- dva meta tagy pro znakovou sadu (charset), to nebude dělat dobrotu
- sem tam zbytečnosti, jak už psal habendorf ...

Doporučení: je vhodné používat běžná písma, protože "Copperplate Gothic Light" nemá každý nainstalován, tudíž se text zobrazí standardním fontem prohlížeče

No, a nakonec možné řešení problému:

CSS:

body {
background-color: #6c6eff;
text-align: center;
margin: 0;
}

#cely {
width: 850px;
margin: 0 auto;
}

#cistic {
clear: both;
visibility: hidden;
}

#okraj {
width: 850px;
margin: 0 auto;
border-style: double;
border-width: 0 7px;
border-color: black;
}

div#hlavicka {
margin: 0 auto;
width: 850px;
height: 110px;
background: #a52a2a;
}

div#obsah {
float: left;
height: 600px;
width: 195px;
background: #edb9b9;
}

div#hlavni {
float: left;
text-align: center;
height: 600px;
width: 655px;
background-color: #ffecec;
}

div#patka {
margin: 0 auto;
width: 920px;
font-size : 80%;
text-align : center;
color: #ffffff;
}

h3 {
margin: 15px auto;
font-weight: bolder;
color: #000000;
font-family: "Copperplate Gothic Light";
font-style: normal;
font-size: 16pt;
text-align: center;
}

h4 {
margin: 15px auto;
font-size: 110%;
color: #ff6347;
text-align: center;
font-weight: bolder;
}

.text {
margin: 15px;
text-align: justify;
}


HTML: 


<body>

 <div id="okraj">

   <div id="hlavicka">

   </div>

   <div id="cely">

     <div id="obsah">

      <h3>Obsah</h3>

     </div>

     <div id="hlavni">

      <h4>kohggihgikj</h4>

      <div class="text">

       Tady bude text stránky.

      </div>

     </div>

     <div id="cistic"></div>

   </div>

 </div>

 <div id="patka">patka</div>

</body>
Majinka
Profil
#11 · Zasláno: 17. 3. 2007, 11:13:54
Odpovědět Citovat
mocinky děkuju!!!!!strašně moc jsi mi pomohl:)
Časová prodleva: 18 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0