html - Auto adjust the height of container based on content -

-

every time put huge content details, such text goes out of container.how can make container height auto adjustable based on content;.

   #container {     background-color: #262626;     width: 1000px;     min-height: 200px;     margin: 0 auto;     margin-top: 40px;     padding-top: 20px;    -webkit-border-top-left-radius: 30px;    -webkit-border-top-right-radius: 30px;    -moz-border-radius-topleft: 30px;    -moz-border-radius-topright: 30px;    border-top-left-radius: 30px;    border-top-right-radius: 30px; }      #main {     position: relative;     top: 116px;     width: 980px;     height: 700px;     float: left;     background-color: #262626;     padding: 10px 10px;     margin-bottom: 40px;     background: -webkit-linear-gradient(#262626,#101010); /* safari */     background: -o-linear-gradient(#262626,#101010); /* opera 11.1 12.0 */     background: -moz-linear-gradient(#262626,#101010); /* firefox 3.6 15 */     background: linear-gradient(#262626,#101010); /* standard syntax */     -webkit-box-shadow: 0 10px 6px -6px black;     -moz-box-shadow: 0 10px 6px -6px black;     box-shadow: 0 10px 6px -6px black;     -webkit-border-bottom-right-radius: 30px;     -webkit-border-bottom-left-radius: 30px;     -moz-border-radius-bottomright: 30px;     -moz-border-radius-bottomleft: 30px;     border-bottom-right-radius: 30px;     border-bottom-left-radius: 30px; }

in #main css you've set height 700px.

change 

height:auto;

and work fine. since default value anyway, remove height declaration completely, instead.

live demo

or, if wanted have minimum height of 700px, say;

min-height:700px;

of course, there many other 'versions' of height can set. including (but not limited to):

  • min-height

the min-height css property used set minimum height of given element. prevents used value of height property becoming smaller value specified min-height.

  • max-height

the max-height css property used set maximum height of given element. prevents used value of height property becoming larger value specified max-height.

  • line height

on block level elements, line-height css property specifies minimal height of line boxes within element.

all of can used set elements in way want

here's reference link you.

mdn summary of height property


Comments

Post a Comment

Popular posts from this blog

matlab - "Contour not rendered for non-finite ZData" -

-
i'm trying plot frequency characteristic equation using ezplot, matlab gives following warning, "contour not rendered non-finite zdata". have used command plot frequency equations warning , plot display empty , not change axis range well. can please help. appreciated. here's code i'm using. % transfer matrix case-i, thin rotor clear all; clc; ei = 1626; l = 0.15; m = 0.44108; = 2.178*10^-4; i_p = 2.205*10^-5; itr = 0.24; i_pr = 0.479; syms p n; f = [1 l*1i l^2/(2*ei)*1i l^3/(6*ei); 0 1 l/ei -l^2/(2*ei)*1i; 0 0 1 -l*1i; 0 0 0 l]; p = [ 1 0 0 0; 0 1 0 0; 0 -it*p^2+i_p*n*p 1 0; -m*p^2 0 0 1]; p_r = [1 0 0 0; 0 1 0 0; 0 -itr*p^2+i_pr*n*p 1 0; -m*p^2 0 0 1]; = f*p*f*p*f*p*f; b = p_r*f*p*f*p*f; r = a(1,2)/a(1,4); a12_p = 0; a22_p = a(2,2)-r*a(2,4); a32_p = a(3,2)-r*a(3,4); a42_p = a(4,2)-r*a(4,4); ap(2,2) = a22_p; ap(3,2) = a32_p; ap(4,2) = a42_p; ap(4,4) = 1; c = b*ap; m = [c(3,2) c(3,4); c(4,2) c(4,...
Read more

delphi - Indy UDP Read Contents of Adata -

-
i using indy udp server read string of data. however, not know how work adata parameter. can around converting binary using bytetobin function below , convert hex using bintohex1 . feel stupid , works slow. know how can directly results without 2 conversions? thanks!! here codes: procedure tform1.idudpserver1udpread(athread: tidudplistenerthread; const adata: tidbytes; abinding: tidsockethandle); var buf: tidbytes; buffer: string; data_received: string; begin if bytestostring(adata) <> 'hello' begin buffer := hextostring('00'); setlength(buf, length(buffer)); copytidstring(buffer, buf, 0); abinding.sendto(abinding.peerip, abinding.peerport, buf); data_received := bintohex1(bytetobin(adata[1]) + bytetobin(adata[2]) + bytetobin(adata[3]) + bytetobin(adata[4]) + bytetobin(adata[5]) + bytetobin(adata[6]) + bytetobin(adata[7]) + bytetobin(adata[8]) + bytetobin(adata[9]) + bytetobin(adata[10]) + bytetobin(adata[11...
Read more

javascript - Any ideas when Firefox is likely to implement lengthAdjust and textLength? -

-
any ideas when firefox implement lengthadjust andtextlength?..... working svg application. lengthadjust , textlength working fine in chrome not working in fire fox . <svg viewbox = "0 0 500 300" version = "1.1"> <defs> <path id="s3" d="m 10,90 q 100,15 200,70" /> </defs> <g> <text font-size = "20"> <textpath xlink:href="#s3" textlength="205"> short text</textpath> </text> <use xlink:href="#s3" fill="none" stroke="black" stroke-width="1"/> </g> </svg> this implemented in firefox text elements (not textpath or tspan) in case that's ok though can move attribute text element. <svg viewbox = "0 0 500 300" version = "1.1"> <defs> ...
Read more