WordPress.org

Make WordPress Core

Ticket #14303: 14303-revised.diff

File 14303-revised.diff, 7.0 KB (added by lancewillett, 4 years ago)

Patch to improve image size handling

  • style.css

     
    44Description: The 2010 theme for WordPress is stylish, customizable, simple, and readable -- make it yours with a custom menu, header image, and background. Twenty Ten supports six widgetized areas (two in the sidebar, four in the footer) and featured images (thumbnails for gallery posts and custom header images for posts and pages). It includes stylesheets for print and the admin Visual Editor, special styles for posts in the "Asides" and "Gallery" categories, and has an optional one-column page template that removes the sidebar. 
    55Author: the WordPress team 
    66Version: 1.1 
    7 Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style 
     7Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style, custom-menu 
    88*/ 
    99 
    1010 
     
    759759/* =Images 
    760760-------------------------------------------------------------- */ 
    761761 
    762 #content img { 
    763         margin: 0; 
    764         height: auto; 
    765         max-width: 640px; 
    766         width: auto; 
    767 } 
     762/* 
     763Resize images to fit the main content area. 
     764- Applies only to images uploaded via WordPress by targeting size-* classes. 
     765- Other images will be left alone. Use "size-auto" class to apply to other images. 
     766*/ 
     767#content img.size-auto, 
     768#content img.size-full, 
     769#content img.size-large, 
     770#content img.size-medium, 
    768771#content .attachment img { 
    769         max-width: 900px; 
     772        max-width: 100%; /* When images are too wide for containing element, force them to fit. */ 
     773        width: auto; /* Necessary for IE8 to resize images correctly. */ 
     774        height: auto; /* Override height to match resized width for correct aspect ratio. */ 
    770775} 
    771 #content .alignleft, 
    772 #content img.alignleft { 
     776.alignleft, 
     777img.alignleft { 
    773778        display: inline; 
    774779        float: left; 
    775780        margin-right: 24px; 
    776781        margin-top: 4px; 
    777782} 
    778 #content .alignright, 
    779 #content img.alignright { 
     783.alignright, 
     784img.alignright { 
    780785        display: inline; 
    781786        float: right; 
    782787        margin-left: 24px; 
    783788        margin-top: 4px; 
    784789} 
    785 #content .aligncenter, 
    786 #content img.aligncenter { 
     790.aligncenter, 
     791img.aligncenter { 
    787792        clear: both; 
    788793        display: block; 
    789794        margin-left: auto; 
    790795        margin-right: auto; 
    791796} 
    792 #content img.alignleft, 
    793 #content img.alignright, 
    794 #content img.aligncenter { 
     797img.alignleft, 
     798img.alignright, 
     799img.aligncenter { 
    795800        margin-bottom: 12px; 
    796801} 
    797 #content .wp-caption { 
     802.wp-caption { 
    798803        background: #f1f1f1; 
    799804        line-height: 18px; 
    800805        margin-bottom: 20px; 
     806        max-width: 632px !important; /* prevent too-wide images from breaking layout */ 
    801807        padding: 4px; 
    802808        text-align: center; 
    803809} 
    804 #content .wp-caption img { 
     810.wp-caption img { 
    805811        margin: 5px 5px 0; 
    806812} 
    807 #content .wp-caption p.wp-caption-text { 
     813.wp-caption p.wp-caption-text { 
    808814        color: #888; 
    809815        font-size: 12px; 
    810816        margin: 5px; 
    811817} 
    812 #content .wp-smiley { 
     818.wp-smiley { 
    813819        margin: 0; 
    814820} 
    815 #content .gallery { 
     821.gallery { 
    816822        margin: 0 auto 18px; 
    817823} 
    818 #content .gallery .gallery-item { 
     824.gallery .gallery-item { 
    819825        float: left; 
    820826        margin-top: 0; 
    821827        text-align: center; 
    822828        width: 33%; 
    823829} 
    824 #content .gallery img { 
     830.gallery img { 
    825831        border: 2px solid #cfcfcf; 
    826832} 
    827 #content .gallery .gallery-caption { 
     833.gallery .gallery-caption { 
    828834        color: #888; 
    829835        font-size: 12px; 
    830836        margin: 0 0 12px; 
    831837} 
    832 #content .gallery dl { 
     838.gallery dl { 
    833839        margin: 0; 
    834840} 
    835 #content .gallery img { 
     841.gallery img { 
    836842        border: 10px solid #f1f1f1; 
    837843} 
    838 #content .gallery br+br { 
     844.gallery br+br { 
    839845        display: none; 
    840846} 
    841 #content .attachment img { /* single attachment images should be centered */ 
     847#content .attachment img {/* single attachment images should be centered */ 
    842848        display: block; 
    843849        margin: 0 auto; 
    844850} 
  • editor-style.css

     
    11/* 
    22Theme Name: Twenty Ten 
     3Description: Used to style the TinyMCE editor. 
    34*/ 
    4 /* 
    5 Used to style the TinyMCE editor. 
    6 */ 
    75html .mceContentBody { 
    8         max-width:640px; 
     6        max-width: 640px; 
    97} 
    108* { 
     9        color: #444; 
    1110        font-family: Georgia, "Bitstream Charter", serif; 
    12         color: #444; 
    1311        line-height: 1.5; 
    1412} 
    1513p, 
     
    4038} 
    4139hr { 
    4240        background-color: #e7e7e7; 
    43         border:0; 
     41        border: 0; 
     42        clear: both; 
    4443        height: 1px; 
    4544        margin-bottom: 18px; 
    46         clear:both; 
    4745} 
    4846/* Text elements */ 
    4947p { 
     
    5856        margin: 0 0 18px 1.5em; 
    5957} 
    6058ol ol { 
    61         list-style:upper-alpha; 
     59        list-style: upper-alpha; 
    6260} 
    6361ol ol ol { 
    64         list-style:lower-roman; 
     62        list-style: lower-roman; 
    6563} 
    6664ol ol ol ol { 
    67         list-style:lower-alpha; 
     65        list-style: lower-alpha; 
    6866} 
    6967ul ul, 
    7068ol ol, 
    7169ul ol, 
    7270ol ul { 
    73         margin-bottom:0; 
     71        margin-bottom: 0; 
    7472} 
    7573dl { 
    76         margin:0 0 24px 0; 
     74        margin: 0 0 24px 0; 
    7775} 
    7876dt { 
    7977        font-weight: bold; 
     
    8280        margin-bottom: 18px; 
    8381} 
    8482strong { 
     83        color: #000; 
    8584        font-weight: bold; 
    86         color: #000; 
    8785} 
    8886cite, 
    8987em, 
    9088i { 
     89        border: none; 
    9190        font-style: italic; 
    92         border: none; 
    9391} 
    9492big { 
    9593        font-size: 131.25%; 
    9694} 
    9795ins { 
    98         background: #ffffcc; 
     96        background: #ffc; 
    9997        border: none; 
    10098        color: #333; 
    10199} 
     
    129127} 
    130128sup, 
    131129sub { 
     130        font-size: 10px; 
    132131        height: 0; 
    133132        line-height: 1; 
     133        position: relative; 
    134134        vertical-align: baseline; 
    135         position: relative; 
    136         font-size: 10px; 
    137135} 
    138136sup { 
    139137        bottom: 1ex; 
     
    142140        top: .5ex; 
    143141} 
    144142a:link { 
    145         color:#0066cc; 
     143        color: #06c; 
    146144} 
    147145a:visited { 
    148         color:#743399; 
     146        color: #743399; 
    149147} 
    150148a:active, 
    151149a:hover { 
     
    157155dd, 
    158156pre, 
    159157hr { 
    160         margin-bottom:24px; 
     158        margin-bottom: 24px; 
    161159} 
    162160ul ul, 
    163161ol ol, 
    164162ul ol, 
    165163ol ul { 
    166         margin-bottom:0; 
     164        margin-bottom: 0; 
    167165} 
    168166pre, 
    169167kbd, 
     
    188186h5, 
    189187h6 { 
    190188        color: #000; 
     189        font-weight: normal; 
     190        line-height: 1.5em; 
    191191        margin: 0 0 20px 0; 
    192         line-height: 1.5em; 
    193         font-weight: normal; 
    194192} 
    195193h1 { 
    196194        font-size: 2.4em; 
     
    212210} 
    213211table { 
    214212        border: 1px solid #e7e7e7 !important; 
     213        border-collapse: collapse; 
     214        border-spacing: 0; 
     215        margin: 0 -1px 24px 0; 
    215216        text-align: left; 
    216         margin: 0 -1px 24px 0; 
    217217        width: 100%; 
    218         border-collapse: collapse; 
    219         border-spacing: 0; 
    220218} 
    221219tr th, 
    222220thead th { 
     
    232230        border-top: 1px solid #e7e7e7 !important; 
    233231        padding: 6px 24px; 
    234232} 
    235  
    236  
    237233img { 
    238234        margin: 0; 
    239         max-width: 640px; 
    240235} 
     236img.size-auto, 
     237img.size-large, 
     238img.size-full, 
     239img.size-medium { 
     240        max-width: 100%; 
     241        width: auto; 
     242        height: auto; 
     243} 
    241244.alignleft, 
    242245img.alignleft { 
    243246        display: inline; 
     
    265268        margin-bottom: 12px; 
    266269} 
    267270.wp-caption { 
     271        background: #f1f1f1; 
    268272        border: none; 
    269         background: #f1f1f1; 
     273        -khtml-border-radius: 0; 
     274        -moz-border-radius: 0; 
     275        -webkit-border-radius: 0; 
     276        border-radius: 0; 
    270277        color: #888; 
    271278        font-size: 12px; 
    272279        line-height: 18px; 
    273         text-align: center; 
    274280        margin-bottom: 20px; 
     281        max-width: 632px !important; /* prevent too-wide images from breaking layout */ 
    275282        padding: 4px; 
    276         -moz-border-radius: 0; 
    277         -khtml-border-radius: 0; 
    278         -webkit-border-radius: 0; 
    279         border-radius: 0; 
     283        text-align: center; 
    280284} 
    281285.wp-caption img { 
    282286        margin: 5px; 
     
    285289        margin: 0 0 4px; 
    286290} 
    287291.wp-smiley { 
    288         margin:0; 
     292        margin: 0; 
    289293} 
     294 No newline at end of file