Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [xhtml] Problem z div'ami, błędne pozycjonowanie
eunix
post
Post #1





Grupa: Zarejestrowani
Postów: 85
Pomógł: 0
Dołączył: 22.02.2006

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

Witam,

Chce osiągnąć taki efekt:
(IMG:http://img253.imageshack.us/img253/4409/costakiegohc5.png)

Narazie wyskrobałem tyle, ale efekty trochę marne, bo nie znam się za bardzo na divach.
Proszę o pomoc w poprawieniu tego!

[HTML] pobierz, plaintext 
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" >
  5.  <head>
  6.  <title></title>
  7.  <meta name="author" content="Święty Mikołaj :-)" />
  8.  <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
  9. <style type="text/css">
  10. body, html {
  11.   margin: 0;
  12.   text-align: center;
  13. }
  14.  
  15. #mainContainer {
  16.    border-spacing: 5px;
  17.    align: center;
  18.    width: 80%;
  19.    text-align: left;
  20.    overflow: auto;
  21.    border-left: 1px solid #717171;
  22.    border-right: 1px solid #717171;
  23. }
  24.  
  25. #siteLogo {
  26.    width: 100%;
  27.    height: 70px;
  28.    float: left;
  29.    background-color: #fbfbfb;
  30.    border: 1px solid #dadada;
  31. }
  32.  
  33. #leftColumn {
  34.    width: 60%;
  35.    height: 500px;
  36.    float: left;
  37.    background-color: #fbfbfb;
  38.    border: 1px solid #dadada;
  39. }
  40.  
  41. #rightColumn {
  42.    width: 40%;
  43.    float: right;
  44.    overflow: auto;
  45. }
  46.  
  47. #rightColumnMenu1 {
  48.    width: 20%;
  49.    float: right;
  50.    background-color: #fbfbfb;
  51.    border: 1px solid #dadada;
  52. }
  53.  
  54. #rightColumnMenu2 {
  55.    width: 20%;
  56.    float: right;
  57.    background-color: #fbfbfb;
  58.    border: 1px solid #dadada;
  59. }
  60.  
  61. #rightColumnMenu3 {
  62.    width: 40%;
  63.    float: right;
  64.    background-color: #fbfbfb;
  65.    border: 1px solid #dadada;
  66. }
  67.  
  68. #siteFooter {
  69.    width: 100%;
  70.    height: 60px;
  71.    float: left;
  72. }
  73.  
  74. </style>
  75. </head>
  76. <body>
  77.  
  78. <div id="mainContainer">
  79. 	<div id="siteLogo">Logo</div>
  80. 	<div id="leftColumn">teststest</div>
  81. 	<div id="rightColumn">
  82. 		<div id="rightColumnMenu1">Menu 1</div>
  83. 		<div id="rightColumnMenu2">Menu 2</div>
  84. 		<div id="rightColumnMenu3">Menu 3</div>
  85. 	</div>
  86. 	<div id="siteFooter">stopka</div>
  87. </div>
  88.  
  89. </body>
  90. </html>
[HTML] pobierz, plaintext


Ten post edytował eunix 26.12.2006, 14:29:18
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
batman
post
Post #2





Grupa: Moderatorzy
Postów: 2 921
Pomógł: 269
Dołączył: 11.08.2005
Skąd: 127.0.0.1
Cytat
Layout powinien być oparty na warstwach


Wiem, że powinien ale powyższy przykład jest dowodem na to, że nie warto się w to bawić. Skoro coś nie działa tak jak powinno lub działa inaczej na różnych przeglądarkach (np. margin, padding, width, border), to nie widzę sensu kombinować w css hacks, by obejść niedoskonałości przeglądarek. Wolę poświęcić ten czas na coś innego, niż na głowienie się jak to obejść. Kropka.
Go to the top of the page
+Quote Post

Posty w temacie
- eunix   [xhtml] Problem z div'ami, błędne pozycjonowanie   26.12.2006, 14:28:17
- - batman   Podany przez Ciebie przykład jest dowodem na to, ż...   26.12.2006, 19:31:05
|- - Denver   Cytat(batman @ 26.12.2006, 21:31:05 )...   26.12.2006, 19:37:29
- - batman   CytatLayout powinien być oparty na warstwach Wiem...   26.12.2006, 19:41:26
- - eunix   Tylko, że temat niżej zrobiłem taki szablon na tab...   26.12.2006, 19:53:53
- - batman   Posypało się, ponieważ różne przeglądarki wstawiaj...   26.12.2006, 20:19:21

« Następny starszy · HTML \ XHTML · 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 · Przełącz na: Linearny+ · Drzewo

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

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