Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS]Prawy DIV dopasowujący się do szerokości przegladarki, Da się bez JS?
AboutMe
post
Post #1





Grupa: Zarejestrowani
Postów: 261
Pomógł: 0
Dołączył: 24.02.2008

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


Załóżmy że przeglądarka ma wewnętrzną szerokość 1400px. Jak zrobić lewy DIV ze stałą szerokością np. 1000px a prawy DIV automatycznie dopasowujący się do wewn. szerokości przeglądarki czyli w tym wypadku 400px. Prawy DIV jest pusty, wyświetla tylko tło. Da się takie coś zrobić bez użycia javascript?
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 3)
ciekawskiii
post
Post #2





Grupa: Zarejestrowani
Postów: 467
Pomógł: 39
Dołączył: 7.11.2010
Skąd: Raz tu, raz tam

Ostrzeżenie: (30%)
XX---


width: 100%; ?
Go to the top of the page
+Quote Post
naitsabes
post
Post #3





Grupa: Zarejestrowani
Postów: 65
Pomógł: 5
Dołączył: 10.09.2010

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


a nie lepiej wrzucic ten lewy div do jakiegos glownego i width:auto ? kiedys mialem z tym problem musisz poczytac tutaj http://htmlhelp.shl.pl/artykuly/artykul.php?nr=1002

Ten post edytował naitsabes 7.11.2010, 12:48:53
Go to the top of the page
+Quote Post
AboutMe
post
Post #4





Grupa: Zarejestrowani
Postów: 261
Pomógł: 0
Dołączył: 24.02.2008

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


Zapomniałem dodać że chciałbym żeby lewy div był w kolorze tła body, tło body to obrazek o szerokości 1000px. W poniższym przykładzie ustawiłem kolor czerwony:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3.  
  4. <style type="text/css">
  5. body { background:red; }
  6. #header { width:100%; }
  7. #header-child { width:1000px; float:left; }
  8. #header-child2 { height:100px; width:auto; background:yellow; }
  9.  
  10. <div id="header">
  11.  
  12. <div id="header-child2">
  13. <div id="header-child">
  14. Ut quis pharetra augue. Nunc tincidunt varius tincidunt. Praesent sollicitudin sem ac mi vestibulum volutpat. Duis porttitor libero non libero dignissim sagittis. Vivamus ultrices consequat nibh, eget sodales lorem eleifend vel. Praesent iaculis ornare laoreet. Cras bibendum elit tincidunt tellus malesuada ut hendrerit tellus malesuada. In hac habitasse platea dictumst. Curabitur rutrum laoreet enim ut bibendum. Ut auctor diam eget velit tempor at mollis eros auctor. Ut dignissim vulputate pharetra. Integer vel mattis nunc. Integer elit sem, imperdiet non rhoncus non, sodales ut ligula. Aenean mauris turpis, suscipit nec tempus sed, sollicitudin ut eros. Ut in ornare neque. Mauris eu ipsum magna. Proin sed sem odio. Donec sed volutpat elit. Pellentesque quam justo, rhoncus ut luctus quis, sollicitudin quis enim.
  15. </div><!--header-child ends-->
  16.  
  17.  
  18. </div><!--header-child2 ends-->
  19.  
  20. </div><!--header ends-->
  21.  
  22. </body>
  23. </html>
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 24.08.2025 - 01:30