26. May 2015
von Blackbam

The following technique is very useful if you have to make existing websites responsive and e.g. want to have two sidebars after the main content without changing the original HTML. You can define the order of the HTML element which have a common parent element by doing the following:

.parent {
  display:-webkit-box;
  display:-moz-box;
  display:box;
  -webkit-box-orient:vertical;
  -moz-box-orient:vertical;
  box-orient:vertical
}

.child1 {
    -webkit-box-ordinal-group:2;
    -moz-box-ordinal-group:2;
    box-ordinal-group:2;
}

.child2 {
  -webkit-box-ordinal-group:3;
  -moz-box-ordinal-group:3;
  box-ordinal-group:3;
}

.child3 {
  -webkit-box-ordinal-group:1;
  -moz-box-ordinal-group:1;
  box-ordinal-group:1;
}

Old box model – more info on the new flexbox model: https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Share

Warning: Undefined variable $time_since in /home/.sites/609/site1266/web/blackbams-blog/wp-content/themes/SilentWoodsByBlackbam/single.php on line 42 Dieser Eintrag wurde am 26. May 2015 um 17:17 in der Kategorie CSS, Web Development veröffentlicht. You can book the comments for this article RSS 2.0. Feedback, discussion, commendation and critics are welcome: Write a comment or trackback.


Tags:

Fatal error: Uncaught Error: Undefined constant "Ext_related_links" in /home/.sites/609/site1266/web/blackbams-blog/wp-content/themes/SilentWoodsByBlackbam/single.php:75 Stack trace: #0 /home/.sites/609/site1266/web/blackbams-blog/wp-includes/template-loader.php(106): include() #1 /home/.sites/609/site1266/web/blackbams-blog/wp-blog-header.php(19): require_once('/home/.sites/60...') #2 /home/.sites/609/site1266/web/blackbams-blog/index.php(17): require('/home/.sites/60...') #3 {main} thrown in /home/.sites/609/site1266/web/blackbams-blog/wp-content/themes/SilentWoodsByBlackbam/single.php on line 75 WordPress › Error

There has been a critical error on this website.

Learn more about troubleshooting WordPress.