Intereting Posts
Не удалось удалить jquery из заголовка и положить до конца тела Дайте пользователям максимальную загрузочную способность; ограничить количество файлов, которые пользователь может загрузить или ограничить количество файлов на загрузку Несколько плагинов, взаимодействующих с меню Как переопределить родительскую страницу темы, которая была включена с require_once? Архив событий по месяцам Опубликовать категории для конкретного автора в данной статье Проблема с выпуском get_post_custom Вызов в Post Content через AJAX Комментарий комментария WordPress для включения комментариев к прикреплению Структура Permalink / page / page / cpt-post дает 404 с разбивкой на страницы Как загрузить библиотечные скрипты в admin из плагинов в оболочке noConflict? Требуемая версия PHP: 5.3.3 – Версии найденные: 5.2.17 … Как и где выполнить обновление до 5.33 Сгенерировать расширенные настраиваемые поля в пользовательской странице меню администратора WP Query 'posts_per_page' Возвращать только количество из запроса wp_query?

сделать титры подписи WordPress отзывчивыми

Эта веб-страница содержит изображения, вставленные WordPress. Код, используемый для вставки первого изображения:

 <a href="http://img.wordpressask.com/responsive/Forest_Legacy_m.jpg"> <img class="size-large wp-image-887" alt="a Forest Legacy group" src="http://img.wordpressask.com/responsive/Forest_Legacy_m-1024x681.jpg" width="1024" height="681" /> </a> a Forest Legacy group 

Это изображение управляется CSS:

 #content .wp-caption a img { width: 614px; height: auto; } 

Я хочу сделать это изображение отзывчивым. Я вставил CSS:

 @media (max-width:988px) { #content .wp-caption a img { width: 99.03225806%; /* 614/620 */ height: auto; } } 

Тем не менее, заголовок DIV.wp остается на 604px, как указано внутри сообщения WordPress. Я попытался указать это как процент (97.41935483%), но WordPress переинтерпретировал его как 104px.

Встроенный CSS переопределяет CSS, который я вставляю в таблицу стилей.

 <div id="attachment_887" class="wp-caption alignnone" style="width: 614px"> 

Любые идеи о том, как я могу сделать отзыв .wp-caption отзывчивым?

Вы захотите использовать:

 @media (max-width: 988px){ .wp-caption { /* Force the box to be 100% */ width: 100% !important; } #content .wp-caption a img { /* Scale down if too big */ max-width: 99.03225806%; /* 614/620 */ height: auto; } } 

Другая возможность – изменить вывод короткого кода, чтобы ширина больше не была жестко закодирована. Изменение примера Codex без ширины:

 add_filter('img_caption_shortcode', 'my_img_caption_shortcode_filter',10,3); /** * Filter to replace the [caption] shortcode text with HTML5 compliant code * * @return text HTML content describing embedded figure **/ function my_img_caption_shortcode_filter($val, $attr, $content = null) { extract(shortcode_atts(array( 'id' => '', 'align' => '', 'width' => '', 'caption' => '' ), $attr)); if ( 1 > (int) $width || empty($caption) ) return $val; $capid = ''; if ( $id ) { $id = esc_attr($id); $capid = 'id="figcaption_'. $id . '" '; $id = 'id="' . $id . '" aria-labelledby="figcaption_' . $id . '" '; } return '<figure ' . $id . 'class="wp-caption ' . esc_attr($align) . '" >' . do_shortcode( $content ) . '<figcaption ' . $capid . 'class="wp-caption-text">' . $caption . '</figcaption></figure>'; } 

http://codex.wordpress.org/Function_Reference/add_filter#Example