CSS - div height calculation without "calc" -


in website, using 2 divs should have height in picture.

so, there div height:90px; aligned bottom of window, can if want 2nd div (red) "fill" rest of window? red div should have height of window minus height of blue div calc(100vh - 90px) wouldn't work, right?

thanks!

actually height: calc(100vh - 90px); does work

html,  body {    min-height: 100%;  }  * {    margin: 0;    padding: 0;  }  footer {    height: 90px;    background: blue;  }  main {    background: red;    height: calc(100vh - 90px);  }
<main></main>  <footer></footer>

however, it's not entirely clear how want react if content cause vertical scrolling. then not answer, probably.

alternative solution flex-box

html,  body {    min-height: 100%;  }  * {    margin: 0;    padding: 0;  }    .wrap {    display: flex;    flex-direction: column;    flex-wrap:no-wrap;    min-height:100vh;  }  main {    background: red;    flex:1;  }    footer {    flex-basis:90px;    flex-shrink:0;    background: rgba(0, 0, 255, 1);  }
<div class="wrap">    <main>      <div class="content"></div>    </main>    <footer>    </footer>  </div>


Comments

Post a Comment

Popular posts from this blog

android - Pass an Serializable object in AIDL -

i have defined aidl file interface imyfeature { void dotask(class clazz); } but need pass class object process. possible in android? if so, how? i tried: interface imyfeature { serializable class; void dotask(class clazz); } but doesn’t work. aidl in android supports custom class implement parcelable interface. in case want send class object not possible. can send class canonical name , retrieve in service. for example have aidl file interface imyfeature { void dotask(string classname); } then call : binder.dotask(myclass.class.getcanonicalname()); and in service binder stub implementation : private final imyfeature mbinder = new imyfeature.stub() { public void dotask(string classname) { try { class<?> clazz = class.forname(classname); constructor<?> ctor = clazz.getconstructor((class[]) null); object object = ctor.newinstance(); ...
Read more

How to provide Authorization & Authentication using Asp.net, C#? -

Image
i have asp.net application in c#. i have provide page authorization specific user/usergroup. i have created 2 tables in database: 1) pagename 2)permissions[insert, update, view, delete] but i'm unable match tables , permissions assigning... can 1 please me, how created tables in database , how coding. please me. you can below explanation. configure access specific file , folder, set forms-based authentication. request page in application redirected logon.aspx automatically. in web.config file, type or paste following code. this code grants users access default1.aspx page , subdir1 folder . <configuration> <system.web> <authentication mode="forms" > <forms loginurl="login.aspx" name=".aspnetauth" protection="none" path="/" timeout="20" > </forms> </authentication> <!-- section denies access files in...
Read more

How to use Authorization & Authentication in Asp.net, C#? -

i using roll management , trying give page , folder access according user or user group, using server created ad group user authentication. i have default1.aspx page default , subdir1 folder give different access separate user group i using below logic in web.config. <location path="subdir1"> <system.web> <authorization> <allow users ="?" /> </authorization> </system.web> </location> i facing problem provide same access 2 or more directory same user should have provide allow user code twice both folder? i can use logic repeating value folder want access providing in 1 logic. i have got answer configure folder/page access, have make different access shown below.. configure access specific file , folder, set forms-based authentication. request page in application redirected logon.aspx automatically. in web.config file, done following code. this code grants user...
Read more