css - What's a cross-browser compatible way to right-align child divs and make the parent div get its width from the children? -

-

i have bunch of child <div>'s of variable width, want right-align within parent . want parent <div> no wider needs to contain children. (i don't know in advance how wide children -- they'll contain dynamically generated content.)

here's example works correctly in ie 8.0 not in firefox 3.5 (child <div>'s aren't right-aligned):

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en"  "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">   <head>     <style type="text/css">       #parentdiv{float:left; text-align:right; background-color: gray;}       .childdiv{clear:both; border: 1px solid black; background-color: white;}     </style>   </head>   <body>     <div id="parentdiv">        <div class="childdiv" style="width: 25px">&nbsp;</div>       <div class="childdiv" style="width: 50px">&nbsp;</div>       <div class="childdiv" style="width: 100px">&nbsp;</div>     </div>   </body> </html>

if add float:right childdiv's css, works in firefox 3.5 not in ie 8.0 (parentdiv's width no longer determined width of children).

is there way can desired behavior in major browsers?

update: apparently adding float:right child divs produces error in ie when i'm hosting page in iis localhost. (which doing.) perhaps issue iis setting? i'm running iis 6.0

update #2: turns out iis 6 causing page load in ie7 standards mode. above code (with float:right added child divs) works ie8 , firefox, apparently not ie7.

i guess makes question: there simple way make work in ie7? (besides using conditional comment or css hack load different stylesheet in ie7, mean.)

edited jan 21, 2010 @ 21:00 mst : need float parent div right. floated child divs right, caused trouble in ie7. if have firebug, take @ this test page, has result you're after. tested in firefox 3.5, ie7, ie8, chrome, , safari 4.

here relevant css , html (i added margin/padding , background colors can more see effect):

   <style type="text/css">       #parent {          margin:0;          background:#ccc;          float:right;          padding:20px;       }       #parent div {          background:#eee;          margin:0 0 20px;          text-align:right;       }    </style>      ...     <div id="parent">       <div>nulla facilisi. suspendisse potenti. sed sed euismod tortor.</div>       <div>lorem ipsum, pharetra nec justo. in dapibus neque libero cursus laoreet nunc luctus.</div>       <div>lorem ipsum dolor sit amdolor.</div>    </div>

my guess why original didn't work ie7 has number of documented bugs (see here list, includes links several float bugs). if float both parent , child elements right, desired results in ie8 , other modern browsers, in ie7 parent's width won't collapse width of widest child (enter mischievous bug).

ie7 behaves expected if float both parent , child elements left, (but isn't after).


Comments

Post a Comment

Popular posts from this blog

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

-
i'm trying create application adheres following: no taskbar no console or form window can utilize console.writeline() . (i.e. if executes app command prompt write console.) the problem if create windows form (or wpf) application can have there no taskbar, console or window show up, console.writeline() nothing. if create console app, writes console, can't figure out how hide (and if did hide it, write command prompt window?)... how do this? just create standard console application. callers responsibility hide window caused program (from how run c# console application console hidden ): system.diagnostics.processstartinfo start = new system.diagnostics.processstartinfo(); start.filename = dir + @"\myprocesstostart.exe"; start.windowstyle = system.diagnostics.processwindowstyle.hidden;
Read more

c++ - Convert big endian to little endian when reading from a binary file -

-
this question has answer here: how convert between big-endian , little-endian values in c++? 28 answers i've been looking around how convert big-endian little-endians. didn't find solve problem. seem there's many way can conversion. anyway following code works ok in big-endian system. how should write conversion function work on little-endian system well? this homework, since systems @ school running big-endian system. it's got curious , wanted make work on home computer also #include <iostream> #include <fstream> using namespace std; int main() { ifstream file; file.open("file.bin", ios::in | ios::binary); if(!file) cerr << "not able read" << endl; else { cout << "opened" << endl; int i_var; double d_var; while(!file.eof()) {...
Read more

openssl - Load PKCS#8 binary key into Ruby -

-
i'm trying load particular private key encoded in binary der format ( pkcs#8 ) ruby. however, openssl::pkey won't recognize it. can make work doing console work , transforming pem so: openssl pkcs8 -inform der -in file.key -passin pass:xxxxxxxx >private_key.pem after this, key can correctly read. however, since whole process done in memory instead of writing , reading files. so question is: possible load private keys binary encoded der format ruby/openssl? thank time, fernando yes, can indirectly load pkcs#8 der-encoded private keys using ruby openssl. openssl::pkey::rsa.new handle pem-formatted pkcs#8, easy read binary der , convert pem-formatted string , load string. for example, these der-encoded private keys: $ openssl genrsa | openssl pkcs8 -topk8 -outform der \ -nocrypt -out pkcs8.key $ openssl genrsa | openssl pkcs8 -topk8 -outform der \ -v2 des3 -passout pass:secret -out pkcs8_des3.key you can this: require 'open...
Read more