html - Make parent div with absolute position take the width of children divs -



html - Make parent div with absolute position take the width of children divs -

i have next html structure:

<div class="parent"> <div class="child1"></div> <div class="child2"></div> </div>

the parent positioned absolutely, child1 , child2 displayed side-by-side using inline-block. need whole thing responsive based on width of 2 children divs. problem is, if increment width of of them, parent's width remains same. changing position relative fixes this, have have in absolute. there anyway responsive?

edit:

i hoping simple, apparently not much... :( here's actual html:

<div class="action_container"> <div class="action_inner"> <div class="action_title">format text</div> <div class="action_body"> <div class="action_args_section"></div> <div class="action_output_section"></div> </div> </div> </div>

and css:

<style> .action_container { display: block; position: absolute; } .action_inner { border: 1px solid black; } .action_inner { min-width: 120px; min-height: 50px; background-color: white; border: 1px solid #666; border-radius: 5px; } .action_title { font-size: 12px; font-weight: bold; text-align: center; border-bottom: 1px solid #ccc; padding: 3px; } .action_args_section { display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; padding: 3px; } .action_output_section { display: inline-block; width: 50px; vertical-align: top; box-sizing: border-box; -moz-box-sizing: border-box; padding: 3px; } </style>

demo

<div class="parent"> <div class="child1"></div> <div class="child2"></div> </div> .parent { position:absolute; height:50px; border:1px solid red; } .child1 { width:100px; height:30px; border:1px solid green; } .child2 { width:150px; height:30px; border:1px solid blue; }

is you're looking for?

html css responsive-design

Comments

Post a Comment

Popular posts from this blog

java Multi query from Mysql using netbeans -

java Multi query from Mysql using netbeans - i have java code retrieve info mysql appropriate code in netbeans.the code below. want multi query such illustration finding total number of products , on.could help me please. in advance import java.sql.*; public class javamysqlselectexample { public static void main(string[] args) { seek { string mydriver = "com.mysql.jdbc.driver"; string myurl = "jdbc:mysql://localhost/sample"; class.forname(mydriver); connection conn = drivermanager.getconnection(myurl, "root", "mypasscode1"); string query = "select * products"; statement st = conn.createstatement(); resultset rs = st.executequery(query); while (rs.next()==true) { int code = rs.getint("code"); string productname = rs.getstring("product_name"); string producttype = rs.getstring("product_type"); system.out.format(" %d, %s, %s\n", code, pr
Read more

c# - DotNetZip fails with "stream does not support seek operations" -

c# - DotNetZip fails with "stream does not support seek operations" - i using dotnetzip in c# unzip stream follows: public static void unzipfromstream(stream stream, string outdir) { //omit seek grab block using (zipfile zip = zipfile.read(stream)){ foreach (zipentry e in zip){ e.extract(outdir, extractexistingfileaction.overwritesilently); } } } stream obtained using webclient client = new webclient(); stream fs = client.openread(url); however, got next exception exception during extracting zip stream system.notsupportedexception: stream not back upwards seek operations. @ system.net.connectstream.get_position() @ ionic.zip.zipfile.read(stream zipstream, textwriter statusmessagewriter, encoding encoding, eventhandler`1 readprogress) on server side(asp.net mvc 4), returning filepathresult or filestreamresult both caused exception. should obtain stream differently on client side? or how create server homec
Read more

c++ - StartServiceCtrlDispatcher don't can access 1063 error -

c++ - StartServiceCtrlDispatcher don't can access 1063 error - i write on c++ service , have error, , don't can fixed it. my service main function int main (int argc, tchar *argv[]) {dword f; for(int i=0;i<113;i++) f = getlasterror(); servicepath = lptstr(argv[0]); outputdebugstring(_t("my sample service: main: entry")); //installservice(); service_table_entry servicetable[] = { {service_name, (lpservice_main_function) servicemain}, {null, null} }; // startservice(); if(!startservicectrldispatcher(servicetable)) { f = getlasterror(); //addlogmessage("error: startservicectrldispatcher"); } else if( memcmp(argv[argc-1],"install",7)) { installservice(); } else if( memcmp(argv[argc-1],"remove",6)) { removeservice(); } else if( memcmp(argv[argc-1],"start",5)) { startservice(); } else if( memcmp(argv[argc-1],"stop",4))
Read more