Поместите изображение рядом с div (чат пузырь)

0

У меня есть изображение пользователя рядом с "чатом", но изображение отображается после пузыря.

Как я могу позиционировать изображение перед чатом и придерживаться div?

Мой код находится здесь: http://www.codepen.io/anon/pen/fFxtl

Спасибо.

  • 1
    Пожалуйста, укажите код на этой странице. Это помогает увидеть код и лучше всего убедиться, что содержание ссылки не меняется. Скрипка всегда хороша, хотя.
Теги:
image

1 ответ

1
Лучший ответ

это то, чего вы хотите достичь

http://www.codepen.io/anon/pen/afyuj

.bubble2{
 float:left 

}

.bubble
{
text-align:left;
color:black;
float:left;
position: relative;
background: gray;
border-left: 2px solid #e67e22;
margin-bottom:3%;
margin-left:0;
padding:5px;
}

.bubble h4 {text-align:left;font-size:14px;font-weight:bold;font-variant:small-caps;clear:both;margin-bottom:3px;padding:0;margin-top:-5px;color:#2ecc71;}
.bubble span {font-size:17px;line-height:1px;font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;}
Поделиться
  • 0
    Это сработало, но это решило мою последнюю проблему, вы удалили CLEAR: ОБА на пузырьковый класс! Это означает, что когда я добавляю несколько пузырьковых классов, они неправильно отображаются в списке друг напротив друга, а не рядом друг с другом. Пожалуйста, помогите - codepen.io/anon/pen/HcpLJ
  • 0
    Можете ли вы дать мне снимок экрана, если ваш окончательный дизайн или чего вы хотите добиться из текста трудно понять
Показать ещё 7 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню