javascript - Flex layout - cell partially collapses in chrome -

-

so i've got bit of weird issue happening in chrome (latest version on mac). here fiddle replicates it: http://jsfiddle.net/mwznjnoc/1/

you'll see search bar has set height of 40px. however, right side red cell has content makes scroll, squishes search bar. moving search bar outside of div in , under header div fixes issue, cannot fix way (the search bar part of view content, gets rendered in div in). removing height: 100%; html , body stops happening, not fix need viewport height 100%. layout works fine in other browsers i've tested with, have idea why happening or way adjust layout prevent it? time in advance!

you forgot flex rule on .search box.

  1. because being part of flex, should remove style height:40px .search box.
  2. then provide flex-grow , flex-shrink 0, , flex-basis 40px.
  3. you may combine 3 1 flex: 0 0 40px. force layout contain .search box within 40px , let other blocks grow or shrink in available space.

changes in html markup:

<div class="search">search bar</div> <!-- remove inline style height -->

changes in css:

.search {     flex: 0 0 40px;    /* add flex rule here */     background: #ccc; }

your fiddle: http://jsfiddle.net/abhitalks/mwznjnoc/3/


Comments

Post a Comment

Popular posts from this blog

c# - Store DBContext Log in other EF table -

-
i want store logs in db table (imported ef code). my code looks this: public pmcontext() : base("myentities") { configuration.proxycreationenabled = false; configuration.lazyloadingenabled = false; this.database.log = s => logstore(s); } private void logstore(string message) { tlog log = new tlog(); log.description = message; log.insertdate = datetime.now; logs.add(log); savechanges(); } public virtual dbset<tlog> logs { get; set; } i cannot use savechanges() (get error "sqlconnection not support parallel transactions") , if remove line nothing stored in db table. how can fix this? i think happens during savechanges call anywhere in app, because sql generated call logged, triggers nested savechanges call tries start own transaction. and there thing: savechanges call in logstore method trigger logging itself, you'd end starting infin...
Read more

javascript - Karma not able to start PhantomJS on Windows - Error: spawn UNKNOWN -

-
i lost "unknown" error: karma.conf.js: frameworks: ['mocha', 'should'], plugins: ['karma-mocha', 'karma-should', 'karma-phantomjs-launcher'], ... browsers: ['phantomjs'], error: 23 07 2015 14:35:37.691:warn [karma]: no captured browser, open http://localhost:9876/ 23 07 2015 14:35:37.701:info [karma]: karma v0.13.3 server started @ http://localhost:9876/ 23 07 2015 14:35:37.707:info [launcher]: starting browser phantomjs 23 07 2015 14:35:37.738:error [karma]: { [error: spawn unknown] code: 'unknown', errno: 'unknown', syscall: 'spawn' } error: spawn unknown @ exports._errnoexception (util.js:749:11) @ childprocess.spawn (child_process.js:1093:11) @ exports.spawn (child_process.js:933:9) @ object._execcommand (c:\users\jinga4x\git\mdl-sample-project\node_modules\karma\lib\launchers\process.js:63:21) @ object._start (c:\users\jinga4x\git\md...
Read more

Nuget pack csproj using nuspec -

-
i want create nuget package contains specified in nuspec file, still version csproj. in order use token have pack like: nuget pack myproj.csproj but when adds dependencies , creates unwanted folder in nuget package. nuspec file is: <?xml version="1.0" encoding="utf-8"?> <package xmlns="http://schemas.microsoft.com/packaging/2011/08/nuspec.xsd"> <metadata> <id>test</id> <version>$version$</version> <title>test</title> <authors>test</authors> <owners>test</owners> <requirelicenseacceptance>false</requirelicenseacceptance> <description>test</description> <summary>test</summary> <releasenotes>test</releasenotes> <copyright>test</copyright> </metadata> <files> <file src="bin\debug\*.dll" target="lib\net45" /> <file s...
Read more