1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Question about CSS

Discussion in 'Styling and Customization Questions' started by the100yen, Mar 27, 2013.

  1. the100yen

    the100yen Member

    I have arranged few icons in my message template

    [​IMG]
    You can see everything is in correct spot



    however if I post long comment, it will look like below

    [​IMG]

    I am not sure how css needs to be configured

    Below are my css which is in my Extra.css

    .icons { * This is the icon in orange

    background-color: #f56a00;
    float: left;
    padding: 10px;
    margin-top: 10px;
     height: auto;
    width: auto;
    margin-left: 40px;
    font-size: 15px;
    border-radius: 10px;
    -moz-box-shadow: 0 0 5px 5px #888;
    -webkit-box-shadow: 0 0 5px 5px#888;
    box-shadow: 0 0 5px 5px #888;

    }

    .PSN {

    float: left;
    padding-top:60px;
    margin-left: -225px;
    }

    .twitter {

    float: left;
    padding-top:60px;
    margin-left: -190px;
    }

    .facebook {

    float: left;
    padding-top:60px;
    margin-left: -155px;
    }
     
  2. Brogan

    Brogan XenForo Moderator Staff Member

    Remove the float:left
     
  3. the100yen

    the100yen Member

    if I take out the float:left from .icons and .PSN I will get this below

    [​IMG]
     
  4. Brogan

    Brogan XenForo Moderator Staff Member

    You need to move the icons to within the message div then.
     
  5. the100yen

    the100yen Member

    Thank you, I move the items to message div and everything is fine!
     
  6. the100yen

    the100yen Member

    Also how do I change the font-size of the username in message user block?
    I am also wanting to change the width of the message user block........I have no idea....
     

Share This Page