WordPress.org

Make WordPress Core

Ticket #22044: 22044.css-only-ie7-love.diff

File 22044.css-only-ie7-love.diff, 6.9 KB (added by mindctrl, 19 months ago)

Add IE7 support to @obenland's patch. Needs IE8/9 testing.

  • style.css

     
    16521652        } 
    16531653} 
    16541654 
    1655  
    1656 /* =IE 7 and 8 
    1657 ----------------------------------------------- */ 
    1658  
    1659 .ie .skip-link, 
    1660 .ie .screen-reader-text, 
    1661 .ie .assistive-text { 
    1662         clip: rect(1px 1px 1px 1px); /* IE7 */ 
    1663 } 
    1664 .ie .site { 
    1665         margin: 48px auto; 
    1666         max-width: 960px; 
    1667 } 
    1668 .ie .site-content { 
    1669         float: left; 
    1670         width: 65.104166667%; 
    1671 } 
    1672 .ie .full-width .site-content { 
    1673         float: none; 
    1674         width: 100%; 
    1675 } 
    1676 .ie .widget-area { 
    1677         float: right; 
    1678         width: 26.041666667%; 
    1679 } 
    1680 .ie img.size-full, 
    1681 .ie img.size-large, 
    1682 .ie img.header-image, 
    1683 .ie img.wp-post-image { 
    1684         width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */ 
    1685 } 
    1686  No newline at end of file 
  • header.php

     
    99 * @since Twenty Twelve 1.0 
    1010 */ 
    1111?><!DOCTYPE html> 
    12 <!--[if IE 7 | IE 8]> 
    13 <html class="ie" <?php language_attributes(); ?>> 
    14 <![endif]--> 
    15 <!--[if !(IE 7) | !(IE 8)  ]><!--> 
    1612<html <?php language_attributes(); ?>> 
    17 <!--<![endif]--> 
    1813<head> 
    1914<meta charset="<?php bloginfo( 'charset' ); ?>" /> 
    2015<meta name="viewport" content="width=device-width" /> 
     
    4843                <?php endif; ?> 
    4944        </header><!-- #masthead --> 
    5045 
    51         <div id="main" class="wrapper"> 
    52  No newline at end of file 
     46        <div id="main" class="wrapper"> 
  • css/ie.css

     
     1body { 
     2        background-color: #e6e6e6; 
     3} 
     4body .site { 
     5        padding: 0 40px; 
     6        margin-top: 48px; 
     7        margin-bottom: 48px; 
     8        box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3); 
     9} 
     10body.custom-background-empty { 
     11        background-color: #fff; 
     12} 
     13body.custom-background-empty .site, 
     14body.custom-background-white .site { 
     15        padding: 0; 
     16        margin-top: 0; 
     17        margin-bottom: 0; 
     18        box-shadow: none; 
     19} 
     20.skip-link, 
     21.screen-reader-text, 
     22.assistive-text { 
     23        clip: rect(1px 1px 1px 1px); /* IE7 */ 
     24} 
     25.full-width .site-content { 
     26        float: none; 
     27        width: 100%; 
     28} 
     29img.size-full, 
     30img.size-large, 
     31img.header-image, 
     32img.wp-post-image { 
     33        width: auto; /* Prevent stretching of full-size and large-size images with height and width attributes in IE8 */ 
     34} 
     35.author-avatar { 
     36        float: left; 
     37        margin-top: 8px; 
     38        margin-top: 0.571428571rem; 
     39} 
     40.author-description { 
     41        float: right; 
     42        width: 80%; 
     43} 
     44.site { 
     45        margin: 48px auto; 
     46        max-width: 960px; 
     47 
     48        overflow: hidden; 
     49} 
     50.site-content { 
     51        float: left; 
     52        width: 65.104166667%; 
     53} 
     54body.template-front-page .site-content, 
     55body.single-attachment .site-content, 
     56body.full-width .site-content { 
     57        width: 100%; 
     58} 
     59.widget-area { 
     60        float: right; 
     61        width: 26.041666667%; 
     62} 
     63.site-header h1, 
     64.site-header h2 { 
     65        text-align: left; 
     66} 
     67.site-header h1 { 
     68        font-size: 26px; 
     69        line-height: 1.846153846; 
     70} 
     71.main-navigation ul.nav-menu, 
     72.main-navigation div.nav-menu > ul { 
     73        border-bottom: 1px solid #ededed; 
     74        border-top: 1px solid #ededed; 
     75        display: inline-block !important; 
     76        text-align: left; 
     77        width: 100%; 
     78} 
     79.main-navigation ul { 
     80        margin: 0; 
     81        text-indent: 0; 
     82} 
     83.main-navigation li a, 
     84.main-navigation li { 
     85        display: inline-block; 
     86        *display: inline !important; 
     87        *zoom: 1; 
     88        text-decoration: none; 
     89} 
     90.main-navigation li a { 
     91        border-bottom: 0; 
     92        color: #6a6a6a; 
     93        line-height: 3.692307692; 
     94        text-transform: uppercase; 
     95} 
     96.main-navigation li a:hover { 
     97        color: #000; 
     98} 
     99.main-navigation li { 
     100        margin: 0 40px 0 0; 
     101        position: relative; 
     102} 
     103.main-navigation li ul { 
     104        display: none; 
     105        margin: 0; 
     106        padding: 0; 
     107        position: absolute; 
     108        top: 100%; 
     109        z-index: 1; 
     110} 
     111.main-navigation li ul ul { 
     112        top: 0; 
     113        left: 100%; 
     114} 
     115.main-navigation ul li:hover > ul { 
     116        border-left: 0; 
     117        display: block; 
     118} 
     119.main-navigation > div > ul > li:hover > ul { 
     120        left: 0; 
     121} 
     122.main-navigation li ul li a { 
     123        background: #efefef; 
     124        border-bottom: 1px solid #ededed; 
     125        display: block; 
     126        font-size: 11px; 
     127        line-height: 2.181818182; 
     128        padding: 8px 10px; 
     129        width: 180px; 
     130} 
     131.main-navigation li ul li a:hover { 
     132        background: #e3e3e3; 
     133        color: #444; 
     134} 
     135.main-navigation .current-menu-item > a, 
     136.main-navigation .current-menu-ancestor > a, 
     137.main-navigation .current_page_item > a, 
     138.main-navigation .current_page_ancestor > a { 
     139        color: #636363; 
     140        font-weight: bold; 
     141} 
     142.menu-toggle { 
     143        display: none; 
     144} 
     145.entry-header .entry-title { 
     146        font-size: 22px; 
     147} 
     148#respond form input[type="text"] { 
     149        width: 46.333333333%; 
     150} 
     151#respond form textarea.blog-textarea { 
     152        width: 79.666666667%; 
     153} 
     154.template-front-page .site-content, 
     155.template-front-page article { 
     156        overflow: hidden; 
     157} 
     158.template-front-page.has-post-thumbnail article { 
     159        float: left; 
     160        width: 47.916666667%; 
     161} 
     162.entry-page-image { 
     163        float: right; 
     164        margin-bottom: 0; 
     165        width: 47.916666667%; 
     166} 
     167.template-front-page .widget-area .widget, 
     168.template-front-page.two-sidebars .widget-area .front-widgets { 
     169        float: left; 
     170        width: 51.875%; 
     171        margin-bottom: 24px; 
     172} 
     173.template-front-page .widget-area .widget:nth-child(odd) { 
     174        clear: right; 
     175} 
     176.template-front-page .widget-area .widget:nth-child(even), 
     177.template-front-page.two-sidebars .widget-area .front-widgets + .front-widgets { 
     178        float: right; 
     179        width: 39.0625%; 
     180        margin: 0 0 24px; 
     181} 
     182.template-front-page.two-sidebars .widget, 
     183.template-front-page.two-sidebars .widget:nth-child(even) { 
     184        float: none; 
     185        width: auto; 
     186} 
  • functions.php

     
    8888 * @since Twenty Twelve 1.0 
    8989 */ 
    9090function twentytwelve_scripts_styles() { 
     91        global $wp_styles; 
     92 
    9193        /* 
    9294         * Adds JavaScript to pages with the comment form to support 
    9395         * sites with threaded comments (when in use). 
     
    141143         * Loads our main stylesheet. 
    142144         */ 
    143145        wp_enqueue_style( 'twentytwelve-style', get_stylesheet_uri() ); 
     146 
     147        /* 
     148         * Loads the Internet Explorer specific stylesheet. 
     149         */ 
     150        wp_enqueue_style( 'twentytwelve-ie', get_template_directory_uri() . '/css/ie.css', array( 'twentytwelve-style' ), '20121002' ); 
     151        $wp_styles->add_data( 'twentytwelve-ie', 'conditional', 'lt IE 9' ); 
    144152} 
    145153add_action( 'wp_enqueue_scripts', 'twentytwelve_scripts_styles' ); 
    146154