The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Icon pushes away fields

View previous topic View next topic Go down

Solved Icon pushes away fields

Post by Hert on July 17th 2015, 12:38 am

Hello,

I've put an icon in the profile fields that's pretty wide - it should be seen as a header kind of thing. But, sadly, the icon pushes away all the fields like so
Spoiler:
But I would like it to appear like this
Spoiler:

I do not know whether I should look at the html or the css.
Hopefully someone can help me with this problem!

Greetings,
Hert


Last edited by Hert on July 17th 2015, 8:01 pm; edited 1 time in total

Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Icon pushes away fields

Post by Ange Tuteur on July 17th 2015, 1:27 pm

Hi @Hert,

From the looks of it, you might be able to fix it by displaying it as a block or floating it. I can't perform a full test since I don't know the structure of the document provided in your image.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Icon pushes away fields

Post by Hert on July 17th 2015, 2:26 pm

Hello @Ange Tuteur (:

Do you mean with structure what type?
Because it's a text field with back to line as seperator.

The HTML in the template is like this:
Code:
<td class="row1" valign="top">
<table width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN profile_field -->
<tr id="field_id{profile_field.ID}">
<td width="120px"><div class="profilelabel">{profile_field.LABEL} &nbsp;</div></td>
<td width="400px"><div class="profilecontent" style="font-weight:bold;">{profile_field.CONTENT}</div></td>
</tr>
<!-- END profile_field -->
</table>
</td>

And the CSS:
Code:
.profilecontent {
background: #fafafa;
padding: 3px;
border-radius: 5px;
width: auto!important;
letter-spacing: 1px;
font: normal 9px arial;
text-transform: uppercase;
display: block;
padding: 3px;
color: #000;
padding-left: 10px;
}

.profilelabel {
padding: 3px;
border-radius: 5px;
width: auto!important;
letter-spacing: 0.5px;
font: 9px arial;
text-transform: uppercase;
display: block;
padding: 3px;
color: #000;
padding-left: 10px;
}
Hopefully that helps? Because I do not know where I should put it to make it float.

Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Icon pushes away fields

Post by Ange Tuteur on July 17th 2015, 7:01 pm

I see you have the ID of the field on the row. You could possibly display it as a block via CSS.

for example :field_id{profile_field.ID}
Code:
tr#field_id {
  display:block;
}

Of course you'll need to use the special ID associated with the field. You may also need to make some structural readjustments too. blackeye

Inside the rows are cells, and depending on the width of those cells, the one that takes up the most width always affects the other cells in that column. Displaying the row ( and maybe that row's cells ) as a block or inline block, should override that behavior.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Icon pushes away fields

Post by Hert on July 17th 2015, 8:01 pm

I've tried doing it through the CSS, but sadly that did not work.
So I tried adding it in the template, adding a style attribute with the display as block and it did work that way!

Thank you very much ^^

Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Icon pushes away fields

Post by SLGray on July 17th 2015, 8:17 pm

So this is solved?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36641
Reputation : 2441
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Icon pushes away fields

Post by APE on July 18th 2015, 2:02 pm

@Hert bump .... Is this problem now solved ?




APE
Manager
Manager

Male Posts : 8614
Reputation : 748
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

Solved Re: Icon pushes away fields

Post by Hert on July 19th 2015, 8:59 pm

I marked it as solved didn't I?

Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Icon pushes away fields

Post by SLGray on July 19th 2015, 9:07 pm

Topic solved and archived


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36641
Reputation : 2441
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum