css position - Issues when HTML body element is positioned 'relative' -

-

on 1 of websites, found body element set position: relative , content inside body seem shifted downwards scale of margin-top css value set on topmost element in body.

  1. why body has css 'position: relative' set? intended fix bug? heard there ie bug not able set absolute positioning of elements.

  2. why 'margin-top' of 'only' first element inside body affects position of every element?

  3. javascript function 'getboundingclientrect()' returns wrong value element not consider margin-top value set on topmost element.

1. why body have css 'position:relative' set? intended fix bug? heard there ie bug not able set absolute positioning of elements.

fc: that's not intended fix bug, because 1 (direct) children of body element has position:absolute. without body having position:relative, child positioned relative canvas (the browser inner window), rather relative body element. see this tutorial ('nested position:absolute') full story. there may have been ie bugs in respect in past, of ie8 ie behaves when comes this.

.
2. why 'margin-top' of 'only' first element inside body affect position of every element?

fc: design. vertical margins affect position of subsequent sibling elements, position:relative; top:20px not. again, see mentioned tutorial full story.

.
3. javascript function 'getboundingclientrect()' returns wrong value element not consider margin-top value set on topmost element.

fc: design, i'm not sure whether interpreting matters correctly. can post code demonstrate it? know should careful method. see this dottoro page full story, including alternatives.


Comments

Post a Comment

Popular posts from this blog

qml - Is it possible to implement SystemTrayIcon functionality in Qt Quick application -

-
i writing qtquick desktop application. use both c++ (for functionality) , qml (for ui) in it. use qquickview show interface written in qml. i want application reside in system tray when minimised. i mean functionality similar example. http://qt-project.org/doc/qt-4.8/desktop-systray.html . trying implement feature not find way in qt quick application. here main.cpp code: #include <qguiapplication> #include <qqmlengine> #include <qqmlcontext> #include <qqmlfileselector> #include <qquickview> #include "myapp.h" int main(int argc, char* argv[]) { qguiapplication app(argc,argv); app.setapplicationname(qfileinfo(app.applicationfilepath()).basename()); qdir::setcurrent(qapp->applicationdirpath()); myapp myappobject; qquickview view; view.connect(view.engine(), signal(quit()), &app, slot(quit())); view.rootcontext()->setcontextproperty("myappobject", &myappobject); new qqmlfilese...
Read more

double exclamation marks in haskell -

-
i have code: ghci>let listoffuns = map (*) [0..] ghci>(listoffuns !! 4) 5 20 what !! mean? i saw example double exclamation this: ghci> [1,2,3,4]!!1 ghci> 2 but seems don't apply question example. how understand function. need explanations. !! indexes lists. takes list , index, , returns item @ index. if index out of bounds, returns ⊥.
Read more

javascript - How to get D3 Tree link text to transition smoothly? -

-
visualization goal: build d3 tree has text at, both, nodes , links, , transitions cleanly, when nodes selected/deselected. problem: while can link text, called "predicates," show along centroid of link paths, can't seem them transition in , out "smoothly." question: can please me please me clean code , better understand how tree "link" transitions behaving understand theory behind code? visualization , source location: http://bl.ocks.org/guerino1/raw/ed80661daf8e5fa89b85/ the existing code looks follows... var linktextitems = vis.selectall("g.linktext") .data(tree.links(nodes), function(d) { return d.target.id; }) var linktextenter = linktextitems.enter().append("svg:g") .attr("class", "linktext") .attr("transform", function(d) { return "translate(" + (d.target.y + 20) + "," + (getcenterx(d)) + ")"; }); // add predicate text each link path li...
Read more