Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [HTML][CSS]Problem z IE i operą - własny szablon
thomson89
post
Post #1





Grupa: Zarejestrowani
Postów: 1 178
Pomógł: 51
Dołączył: 7.01.2009
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----

Witam! Zrobiłem, albo bynajmniej robię swój własny szablon. Jak na razie mam to:
[HTML] pobierz, plaintext 
  1. body {background-color: silver; color: #000; margin: 0; padding: 0; width: 800px; margin: auto;}
  2. #gora {	height: 200px;}
  3. #logo {width: 600px; float: left; overflow: hidden;background-color: white; height: 100px;}
  4. #menu-logo {width: 200px; float: right; overflow: hidden; background-color: white; height: 100px;}
  5. #pasek {background-color: grey; height: 100px;}
  6. #srodek {background-color: white;}
  7. #stopka {clear: both; width: 100%; background-color: #888;}
[HTML] pobierz, plaintext


CODE

<html>
<head>
<title>Moja strona - Strona główna</title>
<link rel="Stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="strona">
<div id="gora">
<div id="logo">mateuszkow.oz.pl</div>
<div id="menu-logo">
<ul>
<li>glowna</li>
<li>kontakt</li>
</ul>
</div>
<div id="pasek">jestes tutaj, godzina</div>
</div>
<div id="srodek">
<div id="menu-pion">
<ul>
<li>glowna</li>
<li>kontakt</li>
</ul>
</div>
<div id="tresc">Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a

pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies.

Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a,

convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis.

Nulla imperdiet sit amet magna. Vestibulum dapibus, mauris nec malesuada fames ac

turpis velit, rhoncus eu, luctus et interdum adipiscing wisi. Aliquam erat ac

ipsum. Integer aliquam purus. Quisque lorem tortor fringilla sed, vestibulum id,

eleifend justo vel bibendum sapien massa ac turpis faucibus orci luctus non,

consectetuer lobortis quis, varius in, purus. Integer ultrices posuere cubilia Curae,

Nulla ipsum dolor lacus, suscipit adipiscing. Cum sociis natoque penatibus et

ultrices volutpat. Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales

lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis,

porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper

quam. Nullam viverra consectetuer. Quisque cursus et, porttitor risus. Aliquam sem.

In hendrerit nulla quam nunc, accumsan congue. Lorem ipsum primis in nibh vel risus. Sed

vel lectus. Ut sagittis, ipsum dolor quam.</div>
</div>
<div id="dol">
<div id="stopka">stopka sialalala</div>
<div id="info">links</div>
</div>
</div>

</body>
</html>


I problem polega na tym, ze w operze pomiedzy gora, a srodek jest wielka dziura. Tak jakby divy rozsunely sie miedzy sobą. Natomiast w IE, gora i srodek sa obok siebie. Dlaczego?
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 10)
potreb
post
Post #2





Grupa: Zarejestrowani
Postów: 1 568
Pomógł: 192
Dołączył: 7.03.2005
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

Opera i Firefox. Wszystko jest inaczej niż w IE.
Daj doctype dokumentu xhtml czy tam html.
W body ustawiłeś 800px dla szerokości. Powinieneś zrobić dla id strony width 800px, resztą div do niego wpakować.

Ten post edytował potreb 2.05.2009, 11:54:11
Go to the top of the page
+Quote Post
thomson89
post
Post #3





Grupa: Zarejestrowani
Postów: 1 178
Pomógł: 51
Dołączył: 7.01.2009
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----

To nic nie dało...
Go to the top of the page
+Quote Post
athei
post
Post #4





Grupa: Zarejestrowani
Postów: 389
Pomógł: 141
Dołączył: 11.04.2009

Ostrzeżenie: (0%)
-----

Po co Ci ten div #strona, korzystaj z html i body. Po co w body 2 różne marginy? Jak ten Twój szablon w ogóle ma wyglądać?
Go to the top of the page
+Quote Post
potreb
post
Post #5





Grupa: Zarejestrowani
Postów: 1 568
Pomógł: 192
Dołączył: 7.03.2005
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

Cytat(thomson89 @ 2.05.2009, 10:58:05 ) *
To nic nie dało...


U mnie wszystko jest dobrze. Poczytaj i poszukaj trochę na temat budowy css i html
I nie opieraj się tylko na IE.
Go to the top of the page
+Quote Post
thomson89
post
Post #6





Grupa: Zarejestrowani
Postów: 1 178
Pomógł: 51
Dołączył: 7.01.2009
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----

Testuje na operze i ie, z racji tego ze opera a mozilla niewiele sie róznią...

nie wychodzi mi nadal

http://www.fotosik.pl/pokaz_obrazek/ba9a17e23ec114f1.html

ps: ale gora i srodek wyswietlaja sie normalnie, pozostaje kwestia tej dziury

Ten post edytował thomson89 2.05.2009, 12:21:27
Go to the top of the page
+Quote Post
Hectic
post
Post #7





Grupa: Zarejestrowani
Postów: 256
Pomógł: 7
Dołączył: 1.01.2005

Ostrzeżenie: (0%)
-----

Wgraj to gdzieś będzie mi łatwiej to sprawdzić, wtedy Ci poprawię.
Go to the top of the page
+Quote Post
potreb
post
Post #8





Grupa: Zarejestrowani
Postów: 1 568
Pomógł: 192
Dołączył: 7.03.2005
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

Wystarczy, że dodasz sobie dla divów bordery i zobaczysz gdzie leż problem.
Go to the top of the page
+Quote Post
thomson89
post
Post #9





Grupa: Zarejestrowani
Postów: 1 178
Pomógł: 51
Dołączył: 7.01.2009
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----

Jak daję border, dla samego diva logo, to pasek zamienia się miejscami z menu-logo.

Proszę bardzo: http://odsiebie.com/pokaz/2573366---56c3.html

Ten post edytował thomson89 2.05.2009, 12:54:03
Go to the top of the page
+Quote Post
potreb
post
Post #10





Grupa: Zarejestrowani
Postów: 1 568
Pomógł: 192
Dołączył: 7.03.2005
Skąd: Warszawa

Ostrzeżenie: (0%)
----- 

[HTML] pobierz, plaintext 
  1. body {
  2. 	background-color: silver;
  3. 	color: #000;
  4. 	padding: 0;
  5. 	margin: 0 auto;
  6. }
  7.  
  8. #strona {
  9. width: 804px;
  10. border: 1px solid #000;
  11. margin: 0 auto;
  12. }
  13.  
  14.  
  15. #gora {
  16. 	height: 200px;
  17. 	border: 2px solid white;
  18. }
  19.  
  20. #logo {
  21. 	width: 600px;
  22. 	float: left;
  23. 	overflow: hidden;
  24. 	background-color: yellow;
  25. 	height: 100px;
  26.  
  27. }
  28.  
  29. #menu-logo {
  30. 	width: 200px;
  31. 	float: right;
  32. 	overflow: hidden;
  33. 	background-color: blue;
  34. 	height: 100px;
  35.  
  36. }
  37.  
  38. #pasek {
  39. 	background-color: green;
  40. 	height: 100px;
  41. 	clear: both;
  42. }
  43.  
  44.  
  45.  
  46. #srodek {
  47. 	background-color: white;
  48.   display: block;
  49.   padding: 20px;
  50. }
  51.  
  52. ul {
  53. padding: 0;
  54. margin: 0;
  55. list-style: none;
  56. }
  57.  
  58.  
  59. #stopka {
  60. 	clear: both;
  61. 	width: 100%;
  62. 	background-color: #888;
  63. }
[HTML] pobierz, plaintext


Wklej tylko ten css co ci podałem

Ten post edytował potreb 2.05.2009, 14:50:01
Go to the top of the page
+Quote Post
thomson89
post
Post #11





Grupa: Zarejestrowani
Postów: 1 178
Pomógł: 51
Dołączył: 7.01.2009
Skąd: Gdańsk

Ostrzeżenie: (0%)
-----

Dziekuję.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 21:36
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn