Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [css] cos a'la 2 kolumny
{VeTeR}
post 17.07.2007, 13:21:35
Post #1





Grupa: Zarejestrowani
Postów: 17
Pomógł: 0
Dołączył: 5.06.2007

Ostrzeżenie: (10%)
X----

Witam

w css chcialbym uzyskac taki efekt



przy kodzie
Kod
div#naglowek
    {
        width:100%;
        background:url('../images/wyswietlacz2.jpg') no-repeat;        
    }    
    
div#prawa_polowa
    {
        position: relative;
        top:0px;
        left: 50%;
        width:50%;
    }
        
div#lewa_polowa
    {
        position: relative;
        top:0px;    
        left: 0px;
        margin: 5px 5px;
        width:50%;          
    }


wyglada to tak ze pierwszy div jest wyzej a drugi pod nim z tym ze na drugiej polowie. gdzie robie blad?
z gory dzieki za pomoc smile.gif


--------------------
Go to the top of the page
+Quote Post
Dandelion
post 17.07.2007, 13:39:14
Post #2





Grupa: Zarejestrowani
Postów: 169
Pomógł: 0
Dołączył: 27.01.2006

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

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3.  <link rel="stylesheet" type="text/css" href="css.css"/>
  4. </head>
  5.  
  6. <body>
  7.  
  8. 	<div id="logo">logo</div>
  9. 	<div id="lewa">lewa</div>
  10. 	<div id="prawa">prawa</div>
  11.  
  12. </body>
  13.  
  14. </html>
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. div#logo{
  2. 	width:700px;
  3. 	height:100px;
  4. 	background-color:orange;
  5. }
  6.  
  7. div#lewa{
  8. 	float:left;
  9. 	width:350px;
  10. 	height:400px;
  11. 	background-color:green;
  12. }
  13.  
  14. div#prawa{
  15. 	float:left;
  16. 	width:350px;
  17. 	height:400px;
  18. 	background-color:yellow;
  19. }
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
{VeTeR}
post 17.07.2007, 14:24:19
Post #3





Grupa: Zarejestrowani
Postów: 17
Pomógł: 0
Dołączył: 5.06.2007

Ostrzeżenie: (10%)
X----

dzieki, sprobowalem ta opcje to tez nie zupelnie dziala.
moze powiem wiecej
ten css jest do newsow wiec wszystko jest zapetlane kilkakrotnie...

Kod
<div id="main">

    <div id="naglowek">
        naglowek
    </div>

    <div id="prawa_polowa">
        <img src="" width="150">
    </div>

    <div id="lewa_polowa">
    tekst
    </div>

</div>
i znowu i znowu...


caly CSS
Kod
div#main
    {
    
        width:435px;
        border: 0;
    
    }    
    
div#naglowek
    {
        width:100%;
        background:url('../images/wyswietlacz2.jpg') no-repeat;
          
        
    }    
    
div#prawa_polowa
    {
        position: relative;
        top:0px;
        left: 50%;
        width:50%;
    }
        
div#lewa_polowa
    {
        position: relative;
        top:0px;    
        left: 0px;
        margin: 5px 5px;
        width:50%;          
    }


niestety wyglada to tak


nie wiem czy nie lepiej poprostu wstawic tam tabelki z dwiema kolumnami :/

hilfe tongue.gif


--------------------
Go to the top of the page
+Quote Post
yaotzin
post 17.07.2007, 15:10:49
Post #4





Grupa: Zarejestrowani
Postów: 157
Pomógł: 0
Dołączył: 12.02.2007
Skąd: Zielona Góra

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

Cytat(Dandelion @ 17.07.2007, 14:39:14 ) *
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3.  <link rel="stylesheet" type="text/css" href="css.css"/>
  4. </head>
  5.  
  6. <body>
  7.      <div id="wrapper">
  8. 	<div id="logo">logo</div>
  9. 	<div id="lewa">lewa</div>
  10. 	<div id="prawa">prawa</div>
  11.     </div>
  12. </body>
  13.  
  14. </html>
[HTML] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. div#logo{
  2. 	width:700px;
  3. 	height:100px;
  4. 	background-color:orange;
  5. }
  6.  
  7. div#lewa{
  8. 	float:left;
  9. 	width:350px;
  10. 	height:400px;
  11. 	background-color:green;
  12. }
  13.  
  14. #wrapper{
  15.  width:700px;
  16.  height:auto;
  17. margin-left:auto;
  18. margin-right:auto;
  19. }
  20.  
  21. div#prawa{
  22. 	float:left;
  23. 	width:350px;
  24. 	height:400px;
  25. 	background-color:yellow;
  26. }
[HTML] pobierz, plaintext


Troszkę poprawione, ale tamta wersja też powinna działać. Klepię z palca więc moga być błędy, dodałem element wrapper który trzyma całość jako jedno, tym samym nic się nie przesuwa tylko trzeba liczyć piksele w szczególności czuły na to jest IE. PZDR

Ten post edytował yaotzin 17.07.2007, 15:11:45


--------------------
------
Per Aspera Ad Astra
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

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

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

RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 02:28
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn