XF 1.1 Custom User Field Icons on the same line?

[Slidefuse]

Hello, As You can see... I'm using icons for my user fields.
But I was wondering how I could make it so they are on the same line... Instead of on top of one another.
This is what I have so far:

But they are under one another, I don't want this.

 

[Paul B]

Without seeing the code, it's difficult to say, but using float:left should work.

 

[Slidefuse]

Without seeing the code, it's difficult to say, but using float:left should work.

Here is the code: (VERY SMALL EDIT OF XENFORO)

<CENTER>Links:<CENTER>
            </xen:hook>           
            <xen:if is="@messageShowCustomFields AND {$user.customFields}">
            <xen:hook name="message_user_info_custom_fields" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
           
                <xen:foreach loop="$userFieldsInfo" key="$fieldId" value="$fieldInfo">
                    <xen:if is="{$fieldInfo.viewable_message}">
                        <xen:if hascontent="true">
                            <dl class="pairsInline userField_{$fieldId}">
                               


                                <dd><xen:contentcheck>{xen:helper userFieldValue, $fieldInfo, $user, {$user.customFields.{$fieldId}}}</xen:contentcheck></dd>
                            </dl>
                        </xen:if>
                    </xen:if>
                </xen:foreach>
               
            </xen:hook>
            </xen:if>
            </xen:contentcheck>
        </div>
    </xen:if>
       
</xen:if>

    <span class="arrow"><span></span></span>
</div>
</div>

 

[Slidefuse]

Still need some help...
:\

 

[Paul B]

Post a link to a thread so I can inspect the code.

 

[Slidefuse]

Post a link to a thread so I can inspect the code.

Here you go : http://www.gentlemannsestate.com/index.php?threads/welcome-back-again.1/#post-62

 

[Jeremy]

.extraUserInfo {
  min-height: 35px;
}

.pairsInline.userField_Steam, .pairsInline.userField_YouTube {
  float: left;
  margin: 2px;
}

You will need to expand on that as you add more fields.

 

[Slidefuse]

.extraUserInfo {
  min-height: 35px;
}

.pairsInline.userField_Steam, .pairsInline.userField_YouTube {
  float: left;
  margin: 2px;
}

You will need to expand on that as you add more fields.

Thank you. but now how could I make it so they are not RIGHT next to one another.
Also how could I re center it?

 

[Jeremy]

Adjust the margin. Re centering it would be:

.pairsInline.userField_Steam {
  margin-left: auto;
}

(Untested)

 

[Slidefuse]

Sadly this does not work :\