Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

TwentyEleven Child CSS

By: HaloDiehards on Oct 28th, 2012  |  syntax: CSS  |  size: 8.51 KB  |  hits: 3  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. /* The space at the top of the page that allows my background image to show  */
  2. #page{
  3.         margin-top: 350px;
  4.         }
  5.        
  6. /* This should change the background image of the posts area */
  7. #page {
  8.         background-image:
  9.         url("http://www.halodiehards.net/wp-content/uploads/2012/06/container-forerunner-texture.jpg") !important;
  10.         background-repeat: repeat;
  11.         }
  12.        
  13. /* Removes comment bubble from top left of posts */
  14. .entry-header .comments-link {display: none;}
  15.  
  16.  
  17.  
  18.  
  19.  
  20. /* SLIDER TWEAKS */
  21. /* These settings fix positioning and look of the front page slider */
  22. #SlideDeck-32-frame {
  23.         margin-left: -37.4% !important;
  24.         margin-top: -20% !important;
  25. }
  26. /* Removes slider author's icon from slider */
  27. .lens-tool-kit.sd2-frame.sd2-nav-pos-bottom.sd2-nav-dots a.slidedeck-2-bug  { display: none !important;
  28. }
  29.  
  30. /* Lightens shadow over images w/ title in slider, originally 0.8 */
  31. lens-tool-kit.sd2-title-dark .sd-node-title-box {
  32.         background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
  33.         }
  34.        
  35.  
  36.  
  37.        
  38.        
  39.         /* COMMENTS TWEAKS */
  40. #respond {
  41.         background-color: transparent !important;
  42.         border: 4px double      #a52a2a !important;
  43.         -webkit-border-radius: 7px;
  44.         -moz-border-radius: 7px;
  45.         -o-border-radius: 7px;
  46.         border-radius: 7px;
  47.         -webkit-box-shadow: 5px 5px 12px rgba(64, 31, 31, 0.5);
  48.         -moz-box-shadow: 5px 5px 12px rgba(64, 31, 31, 0.5);
  49.         box-shadow: 5px 5px 12px rgba(64, 31, 31, 0.5);
  50. }      
  51.        
  52.        
  53.        
  54.  
  55. /* SIDEBAR TWEAKS */
  56. /* Removes bullets from sidebar links */
  57. #secondary li { list-style-type: none;}
  58. #secondary ul { list-style-type: none;}
  59. #extra-sidebar li { list-style-type: none;}
  60. #extra-sidebar ul {list-style-type: none;}
  61.  
  62. /* "centers" widgets in sidebar */                     
  63. .widget-area { padding: 20px 10px 20px 10px;
  64.         /* Wraps widgets in a nice box w/ rounded corners and shadow effect. Nice orange: #ff8c00 Orangey brown: #a52a2a */
  65.         border: 4px double      #a52a2a;
  66.         -webkit-border-radius: 7px;
  67.         -moz-border-radius: 7px;
  68.         -o-border-radius: 7px;
  69.         border-radius: 7px;
  70.         -webkit-box-shadow: 5px 5px 12px rgba(64, 31, 31, 0.5);
  71.         -moz-box-shadow: 5px 5px 12px rgba(64, 31, 31, 0.5);
  72.         box-shadow: 5px 5px 12px rgba(64, 31, 31, 0.5);}
  73.        
  74. /* Adds images to widget backgrounds */
  75. #secondary {
  76.         background-image: url("http://www.halodiehards.net/wp-content/uploads/2012/06/sidebar-halo-4-forerunner-r.jpg") !important;
  77.         }
  78. #extra-sidebar {
  79.         background-image: url("http://www.halodiehards.net/wp-content/uploads/2012/06/sidebar-halo-4-forerunner-l.jpg") !important;
  80.         }
  81.        
  82.        
  83.        
  84. /* Edits to SCOTT DIXON'S CSS are noted */
  85.  
  86. /* Three Column layout - left and right sidebars
  87. --------------------------------------------------*/
  88. .three-column #page { max-width: 1000px;}
  89. .three-column #primary {
  90.     float: left;
  91.     margin: 0 -26.4% 0 0;
  92.     width: 100%;
  93. }
  94.  
  95. /* CHa0s had to change margins, defaults were: margin: 0 34% 0 26.4%, width: 57%; */
  96. .three-column #content {
  97.     margin: 0 0% 0 21.5%;
  98.     width: 57%;
  99.         }
  100.        
  101. .three-column #secondary {
  102.     float: right;
  103.         /* CHa0s changed margin-right from 2.6% to make sidebar flush w content edge and margin-top from no entry to 30% to fit under slider */
  104.     margin-right: 0%;
  105.         margin-top: 30%;
  106.     width: 15%;
  107.         }
  108.  
  109. .three-column #extra-sidebar{
  110.         position:relative;
  111.     float: left;
  112.     width: 15%;
  113.         /* CHa0s changed margin-left from -70% to make sidebar flush w content edge and margin-top from no entry to 30% to fit under slider */
  114.         margin-left: -73.3%;
  115.         margin-top: 30%;
  116.         }
  117. /* Three column - Two Right sidebar layout
  118. ------------------------------------------- */
  119. .two-right #page { max-width: 1000px;}
  120. .two-right #primary {
  121.         float: left;
  122.         margin: 0 -46.4% 0 0;
  123.         width: 100%;
  124. }
  125. .two-right #content {
  126.         margin: 0 46.4% 0 3.6%;
  127.         width: 50.4%; /*slightly wider than alternate layout */
  128. }
  129. .two-right #secondary {
  130.         float: right;
  131.         margin-right: 2.6%;
  132.         width: 19.2%;
  133. }
  134. .two-right #extra-sidebar{
  135.         position:relative;
  136.         float: right;
  137.         margin-right: 2.6%;
  138.         width: 19.2%;
  139. }
  140. /* Three column - Two Left sidebar layout
  141. ------------------------------------------ */
  142. .two-left #page { max-width: 1000px;}
  143. .two-left #primary {
  144.         float: right;
  145.         margin: 0 0 0 -46.4%;
  146.         width: 100%;
  147. }
  148. .two-left #content {
  149.         margin: 0 5.6% 0 46.4%;
  150.         width: 49.4%;
  151. }
  152. .two-left #secondary {
  153.         float: left;
  154.         margin-left: 3.6%;
  155.         margin-right: 0;
  156.         width: 18.8%;
  157. }
  158. .two-left #extra-sidebar{
  159.         position:relative;
  160.         float: left;
  161.         margin-left: 2.6%;
  162.         margin-right: 0;
  163.         width: 18.8%;
  164. }
  165. /* Adjust the comments */
  166. .commentlist, #respond {
  167.    -margin-right: -2%;
  168. }
  169. /* Extra sidebar fix for narrow browsers/media devices */
  170. @media (max-width: 800px) {
  171. #main #extra-sidebar{
  172.                 float: none;
  173.                 margin: 0 7.6%;
  174.                 width: auto;
  175.         }
  176. }
  177. /* Default right sidebar (Twenty Elevens) with extra sidebar alignment fix*/
  178. #extra-sidebar{
  179.         position:relative;
  180.         float: right;
  181.         margin-right: 7.6%;
  182.         width: 18.8%;
  183. }
  184. /* Left sidebar layout (Twenty Elevens) extra sidebar alignment fix */
  185. .left-sidebar #extra-sidebar {
  186.         float: left;
  187.         margin-left: 7.6%;
  188.         margin-right: 0;
  189.         width: 18.8%;
  190. }
  191. /* Fix for gallery attachment pages 1.5 */
  192. .image-attachment #content{
  193.     margin: 0 7.6% 0 7.7%;
  194.     width: 84.8%;
  195. }
  196. /* Better Comments (makes better use of space in comments)
  197. --------------------------------------------------------- */
  198.  
  199. /* Make comments as wide as possible*/
  200. .page-template-sidebar-page-php .commentlist,
  201. .single  .commentlist { width: auto; }
  202. /* Make sure we have room for our comment avatars */
  203. .page-template-sidebar-page-php .commentlist > li.comment,
  204. .singular  .commentlist > li.comment,
  205. .single  .commentlist > li.comment {
  206.         margin-left: 102px;
  207.         width: auto;
  208. }
  209. /* Talking avatars take up too much room at this size */
  210. .page-template-sidebar-page-php .commentlist > li.comment,
  211. .singular  .commentlist > li.comment,
  212. .single  .commentlist > li.comment {
  213.         margin-left: 0;
  214. }
  215. .page-template-sidebar-page-php .commentlist > li.comment .comment-meta,
  216. .page-template-sidebar-page-php .commentlist > li.comment .comment-content,
  217. .singular  .commentlist > li.comment .comment-meta,
  218. .singular  .commentlist > li.comment .comment-content,
  219. .single  .commentlist > li.comment .comment-meta,
  220. .single  .commentlist > li.comment .comment-content {
  221.         margin-right: 75px;
  222. }
  223. /* fix the margin for narrow content in threaded comments */
  224. .commentlist .children li.comment .comment-content,
  225. .commentlist .children > li.bypostauthor, .commentlist > li.bypostauthor {
  226.         margin-right: 0;
  227. }
  228. .page-template-sidebar-page-php .commentlist .avatar,
  229. .singular  .commentlist .avatar,
  230. .single  .commentlist .avatar {
  231.         background: transparent;
  232.         display: block;
  233.         padding: 0;
  234.         top: 1.625em;
  235.         left: auto;
  236.         right: 1.625em;
  237. }
  238. .page-template-sidebar-page-php .commentlist .children .avatar,
  239. .singular .commentlist .children .avatar,
  240. .single  .commentlist .children .avatar {
  241.         background: none;
  242.         padding: 0;
  243.         position: absolute;
  244.         top: 2.2em;
  245.         left: 2.2em;
  246. }
  247.  
  248. .singular #respond,
  249. .single #respond {
  250.         width: 62.9%;
  251. }
  252. /* comment fix for single pages and attachment pages */
  253. #sidebar-page-custom #respond, .single-post #respond {width: auto;}
  254. .commentlist .children  #respond {width:auto;}
  255. .image-attachment .commentlist{width: 68.9%;}
  256. .image-attachment #respond {width: 62.9%;}
  257. .one-column #respond, .wide-column  #respond,
  258. .wide-column .commentlist, .one-column .commentlist, .page-template-default .children  > li#respond {width: auto;}
  259. /* remove the talking arrow, unless you want it */
  260. .commentlist > li.bypostauthor:before , .commentlist > li:before  {
  261.     content: '';
  262. }
  263. /* Change the post author comment look as well */
  264. /* Post Author threaded comments background */
  265. .custom-layouts .commentlist .children > li.bypostauthor,
  266. .custom-layouts .commentlist > li.bypostauthor  {
  267.         background: #efefef;
  268. }
  269.  
  270. /* Use our own way to author highlight :D~ */
  271. .bypostauthor img.avatar {
  272.         border-bottom-right-radius: 0;
  273.         border-bottom-left-radius: 0;
  274.         border-bottom: 5px solid #F5D800;
  275.         padding-bottom: 2px !important;
  276. }
  277.  
  278. /* Singular - one column page template css for extra layouts
  279. /*------------------------------------------------------------*/
  280. .singular #primary {    margin: 0; }
  281. .custom-layouts.singular #content {
  282.         margin: 0 7.6%;
  283.         position: relative;
  284.         width: auto;
  285. }
  286. .custom-layouts.singular .entry-header,
  287. .custom-layouts.singular .entry-content,
  288. .custom-layouts.singular footer.entry-meta,
  289. .custom-layouts.singular #comments-title {
  290.         margin: 0 auto;
  291.         width: 68.9%;
  292. }
  293. .custom-layouts.singular .entry-meta .edit-link a {
  294.         position: absolute;
  295.         left: 0;
  296.         top: 40px;
  297. }
  298. .custom-layouts.singular #author-info {
  299.         margin: 2.2em -8.8% 0;
  300.         padding: 20px 8.8%;
  301. }
create a new version of this paste RAW Paste Data