Advertisement
Guest User

Css Media queries

a guest
Oct 9th, 2014
466
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.00 KB | None | 0 0
  1. @media screen and (max-width:799px){
  2. body, #container, #top-menu-container, #header, #header-content, #content-full, .conwidth, #footer, #footer-sidebar, #creditline, #slide-container, #slide, #slide img, img.site-logo, h1.site-title, #heading, .heading-desc{
  3. max-width:100%;min-width:0;
  4. }
  5. body {
  6. padding:0 5px;
  7. }
  8. #slide-container, #slide, #slide img, #header-bottom {
  9. height:auto;
  10. }
  11. #heading {
  12. margin:0 auto 40px;
  13. }
  14. .heading-desc {
  15. clear:both;
  16. }
  17. #featured-boxs {
  18. margin: 0; padding: 20px 10px; width: 100%;
  19. }
  20. #footer-content {
  21. width: 95%;
  22. }
  23. #right-sidebar, #simplify-main-menu {
  24. clear:both;
  25. float:none;
  26. margin:0 auto;
  27. width:100%;
  28. }
  29. .featured-box-first {
  30. margin: 0 0 20px 0px
  31. }
  32. #featured-boxs img.box-image {
  33. clear:both;
  34. display:block;
  35. margin-bottom:10px;
  36. }
  37. #design-main-menu, #content {
  38. float:none;
  39. width:100%;
  40. }
  41. #footer-sidebar #footer-widget, #footer-sidebar #first-footer-widget, #right-sidebar .widget {
  42. min-width: 200px;
  43. float: left;
  44. margin-left: 15px;
  45. }
  46. #client {
  47. width: 100%;
  48. display: block;
  49. }
  50. .simply-scroll {
  51. width: 95%;
  52. margin: 0 auto;
  53. }
  54. .postmetadata, .postmetadata:hover {
  55. max-width:70%;
  56. }
  57. img.site-logo {
  58. display: block;
  59. float: none;
  60. margin: 0 auto;
  61. }
  62. #featured-boxs img.box-icon {
  63. clear: both;
  64. display: block;
  65. }
  66. h3.featured-box2 {
  67. float: left;
  68. max-width:100%;
  69. }
  70. #piecemaker, #slide-container {
  71. display: none;
  72. }
  73. #simplify-main-menu a {
  74. color: #333333;
  75. }
  76. @media screen and (max-width:599px) {
  77. #social {
  78. display: none;
  79. }
  80. }  
  81. @media screen and (max-width:499px) {
  82. #simplify-main-menu {
  83. float: left;
  84. }
  85. #simplify-main-menu ul {
  86. margin: 0 auto;
  87. }
  88. #simplify-main-menu ul ul ul
  89. {
  90. left: 15px;
  91. top: 20px;
  92. }
  93. #simplify-main-menu a {
  94. margin: 0 auto;
  95. border-bottom: 3px solid #FFFFFF;
  96. padding: 10px;
  97. background: #EEEEEE;
  98. width: 100%;
  99. }
  100. #simplify-main-menu li {
  101. float: none;
  102. width: 220px;
  103. margin: 0 auto;
  104. }
  105. #simplify-main-menu ul ul a {
  106. margin: 0 auto;
  107. width: 90%;
  108. padding: 9px 5%;
  109. }
  110. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement