mrak7575

помогите с настройкой стилей

7 posts in this topic

всем привет ,

сайт тематики 18+ (кто младше прошу не заходить )

 

во такая меня беда постигла 

на скрине я выложил , (вырезал материал 18+)

 

у меня плохо отображаются картинки самые последние ,

сливаются нумерация страниц и картинок,

что то нужно добавить в стилях 

у меня смс дле ,

я просто вырезал из разных шаблонов 

и получилось как то криво ,

вот кусок кода 

 

 
.custom-foto{
width:180px;
height:121px;
float:left;
margin:0 0 10px 10px;
text-shadow:0 1px 0 #fff;
}
.imagebg1{
width:170px;
 
background:#fff;
padding:5px;
box-shadow:0 1px 2px rgba(0,0,0,0.3);
border-radius:5px;
}
.imagebg1 img{
width:170px;
min-height:127px;
}
.imagebg1:hover{
opacity:0.9;
}{
width:180px;
height:210px;
float:left;
margin:0 0 10px 10px;
text-shadow:0 1px 0 #fff;
}
.imagebg1{
width:170px;
height:127px;
background:#fff;
padding:5px;
box-shadow:0 1px 2px rgba(0,0,0,0.3);
border-radius:5px;
}
.imagebg1 img{
width:170px;
min-height:127px;
}
.imagebg1:hover{
opacity:0.9;
}
 
ниже скрин ,
что нужно добавить чтоб не сливались нумерация страниц и последние картинки
вот ссылка на сам сайт
 
 

post-13200-0-05556600-1436907128_thumb.jpg

Share this post


Link to post
Share on other sites

Думаю за активный линк на адалт сайт вам сейчас пред прилетит  ^_^

Share this post


Link to post
Share on other sites

Можно решить так: в конец блока с материалами вставить <div class='clr'></div> clr присвоить стиль clear:both; Это одно из решений, которое точно поможет.

Share this post


Link to post
Share on other sites

Можно решить так: в конец блока с материалами вставить <div class='clr'></div> clr присвоить стиль clear:both; Это одно из решений, которое точно поможет.

 

а можно подробней ?

 

вот шаблон вывода 

 

<div class="custom-foto">
 <div class="imagebg1">
  <div class="overflow"><a href="{full-link}" title="{title}" ><img src="{image-1}" class="custom-foto-img" alt="" /></a></div>
 </div>
  <h2 class="custom-title"><a href="{full-link}" title="{title}" >{title}</a></h2>
  <div class="customdata">
     
  </div>
</div>
 
куда вписывать ?
и как присвоить значение clear:both; в стилях 
плиз плиз

Share this post


Link to post
Share on other sites

 

а можно подробней ?

 

вот шаблон вывода 

 

<div class="custom-foto">
 <div class="imagebg1">
  <div class="overflow"><a href="{full-link}" title="{title}" ><img src="{image-1}" class="custom-foto-img" alt="" /></a></div>
 </div>
  <h2 class="custom-title"><a href="{full-link}" title="{title}" >{title}</a></h2>
  <div class="customdata">
     
  </div>
</div>
 
куда вписывать ?
и как присвоить значение clear:both; в стилях 
плиз плиз

 

В конец блока с материалами. Как присвоить... Уважаемый, зачем задавать вопросы как исправить, если вы ничего не понимаете даже в разметке и стилях...В main.tpl смотрите.

Пропишите в конец блока с материалами пропишите <div style="clear:both"></div>

Share this post


Link to post
Share on other sites
<div class="custom-foto">
   <div class="imagebg1">
      <div class="overflow">
         <a title="очередная подборка фото" href="...">
            <img class="custom-foto-img" alt="" src="...">
         </a>
      </div>
   </div>
   <h2 class="custom-title">
      <a title="очередная подборка фото" href="...">очередная подборка фото</a>
   </h2>
   <div class="customdata"> </div>
</div>

у Вашего дива-обертки - <div class="custom-foto"> - высота меньше, чем высота вложенных элементов, отсюда и обрезает:

.custom-foto{
width:180px;
height:121px; - вот тут надо увеличить высоту
float:left;
margin:0 0 10px 10px;
text-shadow:0 1px 0 #fff;
}

если увеличить хотябы до 170 пикселей, то появится и рамка и название картинки...но есть картинки, которые больше по размеру - они будут косячить...

можно или задать фиксированную высоту картинки:

.imagebg1 img{
width:170px;
min-height:127px;
}
поменять на
.imagebg1 img{
width:170px;
height:127px;
}

тогда картинки не будут вылазить за блок, но большие картинки деформируются...

или заранее подогнать все картинки под определенный размер

mrak7575 likes this

Share this post


Link to post
Share on other sites
<div class="custom-foto">
   <div class="imagebg1">
      <div class="overflow">
         <a title="очередная подборка фото" href="...">
            <img class="custom-foto-img" alt="" src="...">
         </a>
      </div>
   </div>
   <h2 class="custom-title">
      <a title="очередная подборка фото" href="...">очередная подборка фото</a>
   </h2>
   <div class="customdata"> </div>
</div>

у Вашего дива-обертки - <div class="custom-foto"> - высота меньше, чем высота вложенных элементов, отсюда и обрезает:

.custom-foto{
width:180px;
height:121px; - вот тут надо увеличить высоту
float:left;
margin:0 0 10px 10px;
text-shadow:0 1px 0 #fff;
}

если увеличить хотябы до 170 пикселей, то появится и рамка и название картинки...но есть картинки, которые больше по размеру - они будут косячить...

можно или задать фиксированную высоту картинки:

.imagebg1 img{
width:170px;
min-height:127px;
}
поменять на
.imagebg1 img{
width:170px;
height:127px;
}

тогда картинки не будут вылазить за блок, но большие картинки деформируются...

или заранее подогнать все картинки под определенный размер

 

 

спасибо всё как надо объяснил ! всё получилось

 

 

тему можно закрыть!  

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.