Advertisement
Guest User

css parent-child fill

a guest
Aug 4th, 2012
36
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 1.16 KB | None | 0 0
  1. <html>
  2.     <head>
  3.         <meta http-equiv="content-type" content="text/html; charset=utf-8">
  4.         <title>GUI_container</title>
  5.         <style type="text/css">
  6. div{-moz-box-sizing:border-box;}
  7.            
  8. .GUI_window
  9. {
  10.     border: #777777 4px solid;
  11.     -moz-border-image: url(GUI_window.png) 4 repeat;
  12. }
  13. .GUI_window_title
  14. {
  15.     border: #777777 0px solid;
  16.     border-left-width:5px;
  17.     border-right-width: 18px;
  18.     -moz-border-image: url(GUI_title.png) 0 18 0 5  repeat;
  19.     margin-left:10px;
  20. }
  21. .GUI_window_title_buttons
  22. {
  23.     float: right;
  24.     width:10px;
  25.     height:10px;
  26.     margin-left: 3px;
  27. }
  28.  
  29. .GUI_window_content
  30. {
  31.     border: #777777 4px solid;
  32.     -moz-border-image: url(GUI_content.png) 4 repeat;
  33. }      
  34. .GUI_window_resizer
  35. {
  36.     position: relative;
  37.     left: 4px;
  38.     top: -5px;
  39.     float: right;
  40.     width: 9px;
  41.     height: 9px;
  42.     background: #f00;
  43. }
  44.  
  45. #testwin
  46. {
  47.     width: 400px;
  48.     height: 300px;
  49. }
  50.         </style>
  51.     </head>
  52.     <body>
  53.         <div id="testWin" class="GUI_window">
  54.             <span class="GUI_window_title">title</span>
  55.             <div class="GUI_window_title_buttons"></div>
  56.             <div class="GUI_window_content">
  57.                 content<br>content
  58.             </div>
  59.             <div class="GUI_window_resizer"></div>
  60.         </div>
  61.  
  62.     </body>
  63. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement