[CSS]Blokada DIVów - Forum PHP.pl

[CSS]Blokada DIVów

david8213 Zobacz profil	4.10.2019, 12:01:08 Post #1
Grupa: Zarejestrowani Postów: 308 Pomógł: 0 Dołączył: 9.12.2009 Ostrzeżenie: (10%)	Zrobiłem kalendarz z komentarzami w CSS. Na tel jest ok. Jak zablokować przesuwanie się DIVów wraz ze zmniejszaniem rozmiarów okna przeglądarki. Na stronie ma być zawsze 7 kolumn w rzędzie i nie mają przeskakiwać na dół jak zmieniam rozmiar okna w windows... [HTML] pobierz, plaintext <!DOCTYPE html> <html> <head> <style> .ramka { position: relative; width:90%; } .dropdown { position: relative; display: inline-block; color:blue; background-color: #acc; padding: 15px; border: 2px solid white; margin-bottom: 4px; // max-width: 150px; width: 100px; } .days { position: relative; display: inline-block; color:white; background-color: green; padding: 15px; border: 2px solid white; margin-bottom: 4px; // max-width: 150px; width: 100px; } .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); padding: 10px 16px; z-index: 1; margin-top: -1.8em; margin-left: 1.5em; } .dropdown:hover .dropdown-content { display: block; } </style> </head> <body> <center> <br><br><br><br> <div class="days"> <span>Pn</span> </div> <div class="days"> <span>Wt</span> </div> <div class="days"> <span>Sr</span> </div> <div class="days"> <span>Cz</span> </div> <div class="days"> <span>Pt</span> </div> <div class="days"> <span>So</span> </div> <div class="days"> <span>Nd</span> </div> <br> <div class="dropdown"> <span>   </span> </div> <div class="dropdown"> <span>1</span> <div class="dropdown-content"> 1 </div> </div> <div class="dropdown"> <span>2</span> <div class="dropdown-content"> 2 </div> </div> <div class="dropdown"> <span>3</span> <div class="dropdown-content"> 3 </div> </div> <div class="dropdown"> <span>4</span> <div class="dropdown-content"> 4 </div> </div> <div class="dropdown"> <span>5</span> <div class="dropdown-content"> 5 </div> </div> <div class="dropdown"> <span>6</span> <div class="dropdown-content"> 6 </div> </div> <br> <div class="dropdown"> <span>7</span> <div class="dropdown-content"> 7 </div> </div> <div class="dropdown"> <span>8</span> <div class="dropdown-content"> 8 </div> </div> <div class="dropdown"> <span>9</span> <div class="dropdown-content"> 9 </div> </div> <div class="dropdown"> <span>10</span> <div class="dropdown-content"> 10 </div> </div> <div class="dropdown"> <span>11</span> <div class="dropdown-content"> 11 </div> </div> <div class="dropdown"> <span>12</span> <div class="dropdown-content"> 12 </div> </div> <div class="dropdown"> <span>13</span> <div class="dropdown-content"> 13 </div> </div> <br> <div class="dropdown"> <span>14</span> <div class="dropdown-content"> 14 </div> </div> <div class="dropdown"> <span>15</span> <div class="dropdown-content"> 15 </div> </div> <div class="dropdown"> <span>16</span> <div class="dropdown-content"> 16 </div> </div> <div class="dropdown"> <span>17</span> <div class="dropdown-content"> 17 </div> </div> <div class="dropdown"> <span>18</span> <div class="dropdown-content"> 18 </div> </div> <div class="dropdown"> <span>19</span> <div class="dropdown-content"> 19 </div> </div> <div class="dropdown"> <span>20</span> <div class="dropdown-content"> 20 </div> </div> <br> <div class="dropdown"> <span>21</span> <div class="dropdown-content"> 21 </div> </div> <div class="dropdown"> <span>22</span> <div class="dropdown-content"> 22 </div> </div> <div class="dropdown"> <span>23</span> <div class="dropdown-content"> 23 </div> </div> <div class="dropdown"> <span>24</span> <div class="dropdown-content"> 24 </div> </div> <div class="dropdown"> <span>25</span> <div class="dropdown-content"> 25 </div> </div> <div class="dropdown"> <span>26</span> <div class="dropdown-content"> 26 </div> </div> <div class="dropdown"> <span>27</span> <div class="dropdown-content"> 27 </div> </div> <br> <div class="dropdown"> <span>28</span> <div class="dropdown-content"> 28 </div> </div> <div class="dropdown"> <span>29</span> <div class="dropdown-content"> 29 </div> </div> <div class="dropdown"> <span>30</span> <div class="dropdown-content"> 30 </div> </div> <div class="dropdown"> <span>   </span> </div> <div class="dropdown"> <span>   </span> </div> <div class="dropdown"> <span>   </span> </div> <div class="dropdown"> <span>   </span> </div> </body> </html> [HTML] pobierz, plaintext Ten post edytował david8213 4.10.2019, 12:01:52