CSS Клубы

#1 29 декабря 2013 в 15:16
Кто подскажет, как исправить, или что исправить в CSS шаблона, чтоб клубы выводились не в одну левую колонку, а в четыре колонки?
#2 29 декабря 2013 в 15:52
display:block; вам в помощь
#3 29 декабря 2013 в 15:57
Я просто вообще не вьеду где тут и что прописано. Вот код
input.button {
font-size:18px;
}
div.new_club {
margin-bottom:15px;
padding:9px;
padding-left:30px;
padding-right:15px;
background:url(../images/icons/add.png) no-repeat 10px center #EFEFEF;
float:right;
-moz-border-radius:8px 8px 8px 8px;
border-radius:8px 8px 8px 8px;
background-color:#EFEFEF;
}
div.new_club a {
text-decoration:none;
border-bottom:1px dashed;
}
div.club_entry,
div.club_entry_vip {
clear:both;
}
.user_role {
position: absolute;
right: 15px;
top: 15px;
color: #cc3300;
}
.member {
color: #0033cc;
}
.moderator {
color: #009933;
}
div.club_entry_vip {
background: #FFFFD9;
border: 1px solid #FFCC99;
}
div.club_entry .image,
div.club_entry_vip .image {
float: left;
margin-right:14px;
}
div.club_entry .data .title,
div.club_entry_vip .data .title {
margin-bottom: 5px;
}
div.club_entry .data .title a.private,
div.club_entry_vip .data .title a.private {
font-size: 16px;
font-weight:bold;
color:gray;
}
div.club_entry .data .details,
div.club_entry_vip .data .details {
}
div.club_entry .data .details span,
div.club_entry_vip .data .details span {
color: #666;
padding:2px;
padding-left:20px;
margin-right:4px;
font-size:10px;
height:20px;
line-height:20px;
}
div.club_entry .data .details span.rating,
div.club_entry_vip .data .details span.rating {
background:url(../images/icons/rating.png) no-repeat left center;
}
div.club_entry_vip .data .details span.vip {
background:url(../images/icons/vip.png) no-repeat left center;
}
div.club_entry .data .details span.date,
div.club_entry_vip .data .details span.date {
background:url(../images/icons/calendar.png) no-repeat left center;
}
div.club_entry .data .details span.members,
div.club_entry_vip .data .details span.members {
background:url(../images/icons/groups/registered.png) no-repeat left center;
}
table.club_full_entry {
overflow:hidden;
margin-bottom:10px;
width:100%;
}
table.club_full_entry td.left {
overflow:hidden;
margin-bottom:10px;
width:200px;
}
table.club_full_entry .image {
width:200px; padding: 2px; margin-right:14px;
}
table.club_full_entry .data {
}
table.club_full_entry .data .details {
margin-bottom:10px;
border-bottom:solid 1px #789DAF;
padding-bottom:8px;
background:#EFEFEF;
padding:8px;
}
table.club_full_entry .data .details span {
color: #333;
padding:1px;
padding-left:20px;
margin-right:4px;
height:18px;
}
table.club_full_entry .data .details span.vip {
background:url(../images/icons/vip.png) no-repeat left center;
color:#ED8115;
font-weight:bold;
}
table.club_full_entry .data .details span.rating {
background:url(../images/icons/rating.png) no-repeat left center;
}
table.club_full_entry .data .details span.date {
background:url(../images/icons/calendar.png) no-repeat left center;
}
table.club_full_entry .data .details span.members {
background:url(../images/icons/groups/registered.png) no-repeat left center;
}
table.club_full_entry .data .description {
margin-right:20px;
margin-left:8px;
margin-bottom:5px;
clear:both;
}
table.club_full_entry .members_list {
width:200px;
clear:both;
}
table.club_full_entry .members_list .title {
margin-bottom:10px;
padding-top:8px;
padding-left: 8px;
font-weight:bold;
}
table.club_full_entry .members_list .list {
clear:both; overflow:hidden;
}
table.club_full_entry .clubcontent {
clear:both;
margin-bottom:15px;
}
table.club_full_entry .clubcontent p {
padding:0px;
padding-left:5px;
margin-top:0px;
}
table.club_full_entry .clubcontent div.title { padding:10px 10px 10px 40px; border-top:solid 1px #789DAF; color:#375E93; line-height:30px; height:30px; font-size:16px;
}
table.club_full_entry .clubcontent div.blog .title { background:url(../images/icons/big/blog.png) 4px center no-repeat #E0EAEF; }
table.club_full_entry .clubcontent div.album .title { background:url(../images/icons/big/images.png) 4px center no-repeat #E0EAEF; }
table.club_full_entry .clubcontent ul li a.on_moder {
color:#FF6600;
}
table.club_full_entry .clubcontent div.album a.delete {
color:#FF0000;
}
table.club_full_entry .clubcontent span.new {
color:#009900;
font-weight:bold;
}
table.club_full_entry .clubcontent ul { margin:10px 0 10px 30px; }
table.club_full_entry .clubcontent ul li {
margin-bottom:3px;
margin-left:0;
padding-left:0;
}
table.club_full_entry .clubcontent ul li.all a {
color:#999999;
}
table.club_full_entry .clubcontent ul li.service a {
color:#009900;
}
table.club_full_entry .clubcontent #add_album_form input.text {
width:300px;
border:solid 1px silver;
}
.service { color:#009900; margin-left:10px;}

table.club_full_entry .clubmenu { overflow:hidden; clear:both; }
table.club_full_entry .clubmenu div { float:right; line-height:24px; height:24px; margin:0 15px 10px 0; }
table.club_full_entry .clubmenu div.join{ padding-left: 32px; background:url(/templates/octopus/images/icons/clubs/join.png) 0px center no-repeat; }
table.club_full_entry .clubmenu div.leave{ padding-left: 32px; background:url(/templates/octopus/images/icons/clubs/leave.png) 0px center no-repeat; }
table.club_full_entry .clubmenu div.config{ padding-left: 32px; background:url(/templates/octopus/images/icons/clubs/config.png) 0px center no-repeat; }
table.club_full_entry .clubmenu div.invite{ padding-left: 32px; background:url(/templates/octopus/images/icons/clubs/invite.png) 0px center no-repeat; }
table.club_full_entry .clubmenu div.messages{ padding-left: 32px; background:url(/templates/octopus/images/icons/clubs/messages.png) 0px center no-repeat; }
table.club_full_entry .wall .header {
background:#EFEFEF;
padding:10px;
border-top:solid 1px #789DAF;
font-size:16px;
color:#375E93;
}
table.club_full_entry .wall .body {
padding:10px;
}
table.club_full_entry .wall #addwall {
padding:0px;
padding-right:10px;
}
.member_list { float:left; position:relative; }
.member_list .online { font-size:10px; position:absolute; top:0; left:0; border-radius:3px; -moz-border-radius:3px; width:80%; opacity: 0.7; filter: alpha(opacity=70); }
Ткните носом меня где вывод клубов в компоненте прописан?
#4 29 декабря 2013 в 16:04
скайп есть?
#5 29 декабря 2013 в 16:08
вам это надо .club_entry
#6 29 декабря 2013 в 16:21

club_entry

Shahin
Там их несколько, не пойму где
#7 29 декабря 2013 в 16:22
Кто поможет? И цена?
#8 29 декабря 2013 в 16:46
welcome в ICQ
#9 29 декабря 2013 в 16:56
В com_clubs_view.tpl содержимое заменить на:

  1. {if $can_create}
  2. <div class="new_club">
  3. {$LANG.YOU_CAN} <a href="javascript:void(0)" onclick="clubs.create(this);return false;">{$LANG.TO_CREATE_NEW_CLUB}</a>
  4. </div>
  5. {/if}
  6.  
  7. <div class="con_heading">{$pagetitle}</div>
  8.  
  9. {if $clubs}
  10. <table class="categorylist" style="margin-bottom:10px" cellspacing="3" width="100%" border="0">
  11. {assign var="col" value="1"}
  12. {foreach key=tid item=club from=$clubs}
  13. {if $col==1} <tr> {/if}
  14. <td width="" valign="top">
  15. <div class="club_entry{if $club.is_vip}_vip{/if}">
  16. <div class="image">
  17. <a href="/clubs/{$club.id}" title="{$club.title|escape:'html'}" class="{$club.clubtype}">
  18. <img src="/images/clubs/small/{$club.imageurl}" border="0" alt="{$club.title|escape:'html'}"/>
  19. </a>
  20. </div>
  21. <div class="data">
  22. <div class="title">
  23. <a href="/clubs/{$club.id}" class="{$club.clubtype}" {if $club.clubtype=='private'}title="{$LANG.PRIVATE}"{/if}>{$club.title}</a>
  24. </div>
  25. <div class="details">
  26. {if $club.is_vip}
  27. <span class="vip"><strong>{$LANG.VIP_CLUB}</strong></span>
  28. {/if}
  29. <span class="rating"><strong>{$LANG.RATING}</strong> &mdash; {$club.rating}</span>
  30. <span class="members"><strong>{$club.members_count|spellcount:$LANG.CLUB_USER:$LANG.CLUB_USER2:$LANG.CLUB_USER10}</strong></span>
  31. <span class="date"><strong>{$club.fpubdate}</strong></span>
  32. </div>
  33. </div>
  34. </div>
  35. </td>
  36. {if $col==4} </tr> {assign var="col" value="1"} {else} {math equation="x + 1" x=$col assign="col"} {/if}
  37. {/foreach}
  38. </table>
  39. {if $pagination}<div style="margin-top:40px">{$pagination}</div>{/if}
  40. {else}
  41. <p style="clear:both">{$LANG.NOT_ACTIVE_CLUBS}</p>
  42. {/if}
Получите такой результат:
#10 29 декабря 2013 в 18:01
Получилось вот так. А хочется как у вас. Что еще нужно дописать или заменить, чтоб клубы в рамках были
#11 29 декабря 2013 в 18:14
Олег, найдите в своем шаблоне в styles.css
  1. div.club_entry,
  2. div.club_entry_vip {
  3. clear:both;
  4. }
и замените на стиль из дефолта:

  1. div.club_entry,
  2. div.club_entry_vip{
  3. overflow:hidden;
  4. margin-bottom:5px;
  5. padding:15px;
  6. border:solid 1px #C3D6DF;
  7. border-radius:8px;
  8. -moz-border-radius:8px;
  9. clear:both;
  10. position: relative;
  11. }
#12 29 декабря 2013 в 18:41
Джехутимери, Спасибо за помощь. Все получилось. danceТолько после правки CSS кеш сайта чистить нужно, а то стили не меняются.
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.