html - css div liquidlike/autoadjust size -


If content is overflowed, then I just want to adjust the height of the container automatically, it will only flow over.

This is the code I have on the site:

Just forget about HTML and Focus on CSS, CSS I get an error.

  .game_wrapper {width: 210px; Height: auto; Status: Relative; Background: #fafafa; Background: url (bg1.png); Limit: 1px dashed # 7f7f7f; Padding: 3px; } .game_container {width: 90px; Height: 85px; Limit: 1 px solid #fff; Swim left; Margin: 3px; Text-align: center; -MOZ-BOX-SHADOW: 0 px 0 px 1 pixels # 000000; -WebKit-Box-Shadow: 0 px 0 px 1 pixels # 000000; Box-Shadow: 0 px 0 px 1 pixel # 000000; Border-radius: 1px; Padding: 3px; Transition: All .2s; -WebKit-Infection: All .2s; -MOZ-Infection: All .2s; -O-Infection: All .2s; Status: Relative; Background: url (background.jpg); Background size: 100%; } .game_container: Hover {boundary: 1px solid # c0c0c0; } .game_container img {width: 100%; Height: 70px; -Winkit-Filter: Brightness (110%); Padding-bottom: 3px; Border Bottom: 1px solid #fafeph; Transition: All .2s; -WebKit-Infection: All .2s; -MOZ-Infection: All .2s; -O-Infection: All .2s; Background: url (bg2.png); } .game_container: hover img {-webkit-filter: brightness (120%); } .game_container .name {font-size: 10px; Color: # 0f5f5f; Background: url (bg1.png); } .game_container: hover .name {color: # 949400; Font-size: 12px; } .game_container a: link, .game_container a: visited {text-decoration: none; } .game_container.in.in {Box-Shadow: Inset 0 1px 2px rgba (0,0,0, .07); Border: 1 px solid # a0a0a0; Text-align: justified; Background: # 01a2ff; Border color: #ddd; Status: Completed; Font-family: Verdana, Geneva, sans-serif; Font-size: 12px; Color: #E0F7FC; Height: 120px; display none; Padding: 10px; Width: 220px; Left: 110%; Top: 0px; Z-index: 1; } .game_container .info: {content: ''; Status: Completed; Left: -6px; Top: 15px; Z-index: 2; Border bottom: 1 px solid # a0a0a0; Border-left: 1px solid # a0a0a0; Box-Shadow-bottom: Inset 0 1px 2px rgba (0,0,0, .07); Box-Shade-Left: Inset 0 1px 2px RGBA (0,0,0, .07); Background: # 01a2ff; Height: 10px; Width: 10px; Display area; Consequently: rotate (45 degrees); -WebKit-Converting: To rotate (45 degrees); -MOZ-Transform: to rotate (45 degrees); } .game_container: hover.info {display: block; } .game_container.info: hover {transition: all 0s; -WebKit-Infection: all 0s; -Mozy-infected: all 0s; -O-Infection: All 0s; display none; } .game_container .title {font-size: 14px; Color: #E0F7FC; } .game_container .description {margin-top: 5px; Color: # F2F9FE; Font-family: Arial; Font-size: 10px; }  

You need to explain the main cover

  .clarfix: first, .clarfix: after {content: ""; Display: Table; } .clarfix: after {clear: both; } / * IE 6/7 * / .clearfix {Zoom: 1; }  

Add a square. Clearing the main cover

  & lt; Div class = "clearfix game_wrapper" & gt;  

more cleaner


Comments

Popular posts from this blog

import - Python ImportError: No module named wmi -

Editing Python Class in Shell and SQLAlchemy -

c# - MySQL Parameterized Select Query joining tables issue -