html - Can't center animated div with Animate.CSS or other animation libraries -

-

i'm trying center div in page , animate it, but

transform:translate(-50%, -50%)

will not work @ relying on default

top: 50%; left: 50%

here html code:

<html> <head>       <link href="http://www.exaltedweb.com/refs/animate.css" rel="stylesheet" type="text/css"/>     <link href="stylesheets/admin2.css" rel="stylesheet" type="text/css"/> </head> <body>     <div id="container">         <div class="modal-wrapper" style="position: absolute; width: 100%; height: 100%; top: 0; left: 0; display:block;">             <div class="modal-background" style=""></div>             <div class="modal-content animated bouncein"></div>         </div>     </div> </body>

here css:

#container{     width: 100%;     height: 100%; }  .modal-wrapper{     position: absolute;      width: 100%;      height: 100%; }  .modal-background{     position: absolute;      width: 100%;      height: 100%;      background-color: rgba(0,0,0,0.5);      display:block; }  .modal-content{     top: 50%;      left: 50%;      position: absolute;      transform: translate(-50%, -50%);      width: 100px;      height: 100px;      background-color: blue; }

i've tried ton of things display: block; , bunch of other methods found online, none of methods have works. appreciated i've been stuck on issue entire day. in advance!

check jsfiddle "jsfiddle.net/solaceinfotech/7sj2ma2m/3/" set html element @ center of page. change height within #container {}

if want set element @ center specific size of block. else set 100% block display @ center of whole page.

it tested in chrome, opera , firefox , working fine these browsers.


Comments

Post a Comment

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

-
i use delphi xe2 , indy10 udp protocol. can't receive server echo on client side if use receivebuffer method. got "socket error # 10040" although send small echo message server client. console application illustrate problem below. in advance. program project1; {$apptype console} {$r *.res} uses system.sysutils, idglobal, idbasecomponent, idcomponent, idsockethandle, idudpclient, idudpserver, idudpbase, idstack; type tudp_serv = class(tidudpserver) procedure udpsvudpread(athread: tidudplistenerthread; adata: tidbytes; abinding: tidsockethandle); end; var udpserver: tudp_serv; udpcl: tidudpclient; bsnd, brcv: tbytes; s: string; k: integer; //============================================================================== procedure tudp_serv.udpsvudpread(athread: tidudplistenerthread; adata: tidbytes; abinding: tidsockethandle); begin writeln(' server read: ' + tohex(adata, length(adata))); abinding sendto(peerip, peerport, adat...
Read more

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

-
i new windows programming. here goes code objiwbemlocator = new qaxobject("wbemscripting.swbemlocator"); objwmiservice = objiwbemlocator->querysubobject("connectserver(qstring&,qstring&)",qstring("."),qstring("root\\cimv2")); qaxobject* returnlist = objwmiservice->querysubobject("execquery(qstring&)", qstring("select * %1").arg(domain)); qaxobject* result = returnlist->querysubobject("itemindex(int)", 0); i getting error on runtime qt activex wmi qaxbase::dynamiccallhelper: itemindex(int): no such property in but itemindex method exists msdn says the itemindex method not work collections not contain swbemobjects, such swbemmethodset, swbemnamedvalueset, swbemprivilegeset, swbempropertyset, , swbemqualifierset. what selecting ? have tried iterating on collection ? plus need minimum windows vista itemindex method. hope helps
Read more

Enable autocomplete or intellisense in Atom editor for PHP -

-
i'm first time user of atom editor php code. atom can autocomplete built-in functions of php. possible make editor autocomplete custom function written in separate file? function.php <?php function printsomething() { echo "hello world"; } index.php <?php require_once "function.php"; printsomething(); // autocompleted atom editor while typing thanks in advance. there text file in %userprofile%.atom called snippets.cson. in there can add snippet. more this: http://flight-manual.atom.io/using-atom/sections/snippets/ but need think can use later on other files well. otherwise need copy , paste.
Read more