I want to know how to get this effect with Invision.  


 
Since no one has been able to answer, I ask help to you. 
If you can explain yourself in simple and clear directions because English is not my first language.   


This is the code for phbb3

Code:

.topiclist.forums dd.lastpost {
-moz-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
background-color: #DEE7F7 ;
border-radius: 5px;
box-shadow: 2px 2px 2px  #8397B3 ;
margin: 6px 13px;
}

Thanks for the help everyone  

Hello,

Try this CSS :

Code:


.ipbtable.index-box .row1 span {
-moz-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
background-color: #DEE7F7 ;
border-radius: 5px;
box-shadow: 2px 2px 2px #8397B3 ;
margin: 6px 13px;
display:block;
}
.ipbtable.index-box .row1 span span {
display:inline;
box-shadow:none;
}

It works perfectly   . Thank you very much!
There's only one problem: the mini avatar is moved.  


How can I fix it in the right position?  

This is the code i used

Code:

.mini_ava img {
      width: 20px;
      height: 20px;
      border-radius: 2px;
  margin: 4px ;
      transition: all 2s;
      -moz-transition: all 2s;
      -webkit-transition: all 2s;
      -o-transition: all 2s;
    }

Please post a link to your forum.

Thanks

Ok

http://prove2014.forumattivo.it/


(I use it to make tests)

Add this CSS :

Code:

.mini_ava img { margin:5px 0px 0px 15px; }
.ipbtable.index-box .row1 span { padding:3px; }

Perfect!   
(But how do you do it so quickly? )
Thanks again   

You're welcome

I open the Firefox tools (f12) to inspect the DOM, then write my CSS to test.

Topic solved and archived