Вертикально выравнивающие q теги

-1

В настоящее время я пытаюсь вертикально выровнять тег q в моем CSS, но по какой-то причине кавычки также не выравниваются, что создает проблему. Вот соответствующая часть кода в вопросе:Вертикально выравнивающие q теги

q { 
    vertical-align: top; 
}

Here is an image проблемы. Я не знаю, является ли это какой-то сложной проблемой, связанной с взаимодействием нескольких частей, но если это так, вот мои файлы html и css.

источник

2016-10-02 MegaZeroX

Я не знаю, если это становится downvoted, потому что эта страница является запас веб-программирование домашнего задания, но уточнить, используя интернет-ресурсы, как переполнение стека, является как разрешен и принят, где Я хожу в школу. – MegaZeroX

Я предполагаю, что downvote - это то, что вы должны вставить свой минимальный HTML и CSS, чтобы воссоздать вашу проблему. Но ваш образ отображает больше, чем q-тег. – Aaron

Yup - проверка [MCVE]. Stack Overflow устанавливает бар достаточно высоким с точки зрения качества вопросов - сделайте его максимально простым для потенциальных ответчиков, и вы, вероятно, получите гораздо лучшую реакцию. – Jeff

Свойство вертикали выравнивания применяется только к:

инлайн-уровня и элементов 'Table-Cell'

Смотрите эту link.

попробовать

q { 
    display: inline; 
    vertical-align: top; 
}

источник

2016-10-02 20:00:27 Aschab

Итак, материал внутри q встроен, однако кавычки, которые он создает, не являются встроенными? Если это так, это объясняет, почему он не работает. К сожалению, встроенный дисплей не устраняет проблему. – MegaZeroX

У вас уже есть код, вы можете создать пример jsfiddle или кода? таким образом я могу легко разветвить его и помочь вам разобраться – Aschab

Хорошо, я создал копию [здесь] (https://jsfiddle.net/MegaZerox/8fgkc8z4/). У него нет изображений, но они не важны, поскольку теги котировок внутри тегов p являются те, у которых проблемы. – MegaZeroX

Попробуйте использовать поплавок влево на изображении вместо этого.

img { 
 
    float: left; 
 
}

<p class="quote"> 
 
    <img src="http://placehold.it/50x50" alt="Fresh" /> 
 
    <q>TMNT is a fun, action-filled adventure that will satisfy longtime fans and generate a legion of new ones.</q> 
 
</p>

источник

2016-10-02 20:04:32 knutesten

Это работает, но я все равно хотел бы найти способ обойти эту странную цитату для будущего использования. Я хотел бы иметь возможность вертикально выравнивать все теги q. – MegaZeroX

Вертикально выравнивающие q теги

ответ

Смежные вопросы