Sign in to follow this  
Followers 0
qwert1212

Помогите разобраться с CSS

9 posts in this topic

Всем Привет, прошу Вас помочь разобраться с CSS. Вопрос в общем заключается в следующем как сделать чтобы два блока div отображались как на картинке пример из всем известного контакта post-8810-0-44411300-1411900711_thumb.jpg справа информация о пользователе, что нужно прописать в файле css чтобы 2 блока отображались так же? 

Помогите нубу кто чем может, за ранее спасибо!

Share this post


Link to post
Share on other sites

Если я вас правильно понял, тогда вот так:

.user-avatar{
width: 200px;
height: 500px;
background: #eee;
float: left;
}
.user-info{
width: 300px;
height: 600px;
background: #555;
float: left;
}

/*
При условии, что блок, в который они вложены это позволяет.
Его ширина должна составлять 500+px
*/
Edited by Jeka778
qwert1212 and desoxy like this

Share this post


Link to post
Share on other sites

Не совсем понятно, обтекание? то с помощью float:left|right;

Нет на картинке справа информация о пользователе первый блок день рожденья, второй 14 сентября и т.д, вот это меня интересует 

Share this post


Link to post
Share on other sites

Ну несколько слоев подряд идут, в чем вопрос то? Сложно что ли посмотреть исходник страницы вк?

Share this post


Link to post
Share on other sites

Ну несколько слоев подряд идут, в чем вопрос то? Сложно что ли посмотреть исходник страницы вк?

Это понятно, вопрос что прописать в файле css  чтобы блоки отображались так же, исходник вк вот 

<div id="profile_short" >
    <div class="profile_info"><div class="clear_fix ">
  <div class="label fl_l">День рождения:</div>
  <div class="labeled fl_l"><a href="/search?c[section]=people&c[bday]=9&c[bmonth]=8">14 сентября 1965 г.</a></div>
</div><div class="clear_fix miniblock">
  <div class="label fl_l">Родной город:</div>
  <div class="labeled fl_l"><a href="/search?c[name]=0&c[section]=people&c[hometown]=%D0%90%D1%81%D1%82%D1%80%D0%B0%D1%85%D0%B0%D0%BD%D1%8C">Санкт-Петербург</a></div>
</div>

Share this post


Link to post
Share on other sites

Там заданы стили для блоков, но легче сделать посредствам таблицы:

<table>
  <tr>
    <td>День рождения<td>
    <td>Дата рождения<td>
  </tr>
  <tr>
    <td>Родной город<td>
    <td>Город<td>
  </tr>

/*
Для управления шириной можно использовать селекторы, изначально присвоив им нужные свойства.
*/
Macdec, Whitecrechet and qwert1212 like this

Share this post


Link to post
Share on other sites

 

Там заданы стили для блоков, но легче сделать посредствам таблицы:

<table>
  <tr>
    <td>День рождения<td>
    <td>Дата рождения<td>
  </tr>
  <tr>
    <td>Родной город<td>
    <td>Город<td>
  </tr>

/*
Для управления шириной можно использовать селекторы, изначально присвоив им нужные свойства.
*/

Спасибо тебе точно стили я че то тупанул )

Share this post


Link to post
Share on other sites
Guest
This topic is now closed to further replies.
Sign in to follow this  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.