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.

How do I make a message divider taller?

View previous topic View next topic Go down

Solved How do I make a message divider taller?

Post by Kamui on March 15th 2016, 4:43 pm

Hello, I'm not sure what it's called exactly but I would like to increase the height of this divider between post. If it's possible I want to place my own image for it as well.




Here's an example of what I mean.



Last edited by Kamui on March 16th 2016, 2:19 am; edited 1 time in total

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Van-Helsing on March 15th 2016, 4:51 pm

Hello,
Find this code in your CSS(if there isn't then just add the second code):

Code:
.pun .posthead {
    background: #f4f4f4;
    border-bottom: 1px dashed #ccc;
    padding: .5em 1.3em .5em 1em;
}

and replace it with this code:

Code:
.pun .posthead {
    background: #f4f4f4;
    border-bottom: 1px dashed #ccc;
    padding: .5em 1.3em .5em 1em;
    line-height: 30px;
}

you can modify the line-height as you wish.

Van-Helsing
Hyperactive

Male Posts : 2198
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Sir Chivas™ on March 15th 2016, 4:52 pm

Hi,

Which forum version are you trying to accomplish this in? Can you also provide a forum URL?

Regards,
Sir Chivas.



Attention!
- Please provide your forum URL at all times.
- When the issue is solved, please mark it as solved.



Sir Chivas™
Support Moderator
Support Moderator

Male Posts : 6756
Reputation : 428
Language : English, Spanish, and French
Location : || CSS || HTML || Graphics Designs || Support ||

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Kamui on March 15th 2016, 5:01 pm

Thank you, and it worked. Will I be able to place GFX IMG where it says background though @Van-Helsing ?

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Van-Helsing on March 15th 2016, 5:05 pm

Yes of course @Kamui,

Replace your previous code with this:

Code:
.pun .posthead {
            background-image: url (YOUR_IMAGE_URL);
            border-bottom: 1px dashed #ccc;
            padding: .5em 1.3em .5em 1em;
            line-height: 30px;
        }

You will need to replace YOUR_IMAGE_URL with the link of your image.

Van-Helsing
Hyperactive

Male Posts : 2198
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Kamui on March 15th 2016, 5:36 pm

I used the image, how come it isn't working?
Code:
.pun .posthead {
            background-image: url (http://i.imgur.com/ZrE1B0u.png);
            border-bottom: 1px dashed #ccc;
            padding: .5em 1.3em .5em 1em;
            line-height: 30px;
        }

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Van-Helsing on March 15th 2016, 5:58 pm

@Kamui do you have you twice the element .pun .posthead in your css?

Van-Helsing
Hyperactive

Male Posts : 2198
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Kamui on March 15th 2016, 6:34 pm

I'm not sure what you mean.

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Van-Helsing on March 15th 2016, 9:50 pm

Hello,
Try to add the following code in your css:

Code:

.pun .posthead h2 {
    background-image: url('http://i.imgur.com/ZrE1B0u.png') !important;
}

The result must be looks like this:




Last edited by Van-Helsing on March 15th 2016, 10:25 pm; edited 1 time in total

Van-Helsing
Hyperactive

Male Posts : 2198
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by SLGray on March 15th 2016, 9:51 pm

Code:
 .pun .posthead {
  background-image: url ('http://i.imgur.com/ZrE1B0u.png');
  border-bottom: 1px dashed #ccc;
  padding: .5em 1.3em .5em 1em;
  line-height: 30px;
}


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


SLGray
Administrator
Administrator

Male Posts : 35641
Reputation : 2374
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Kamui on March 16th 2016, 1:53 am

I'm staring to wonder if somethings just wrong with my forum. I followed the code exactly but it isn't working.

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Van-Helsing on March 16th 2016, 2:14 am

Hello @Kamui,
Try this code:

Code:
.pun .posthead {
    background: url('http://i.imgur.com/ZrE1B0u.png');
}

Van-Helsing
Hyperactive

Male Posts : 2198
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Kamui on March 16th 2016, 2:19 am

Finally, it works. Thanks a lot man you some how keep coming through. I appreciate all the help you and everyone has given today!

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Van-Helsing on March 16th 2016, 2:21 am

@Kamui you can improve it by replacing code with the following:

Code:
.pun .posthead {
    background: url(http://i.imgur.com/ZrE1B0u.png);
    color: white;
    line-height: 38px;
}
.pun .posthead a {
    color: white !important;
}

You are welcome. Smile

Van-Helsing
Hyperactive

Male Posts : 2198
Reputation : 82
Language : English, Greek

http://helpgr.forumgreek.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by Kamui on March 16th 2016, 12:08 pm

Thanks!

Kamui
Forumember

Male Posts : 280
Reputation : 3
Language : English
Location : Greed Island

http://narutogaiden.forumotion.com/

Back to top Go down

Solved Re: How do I make a message divider taller?

Post by brandon_g on March 16th 2016, 5:35 pm

Thanks for the help Van-Helsing Very Happy.

Topic solved and archived ~ brandon_g


Remember to mark your topic when a solution is found.

brandon_g
Support Moderator
Support Moderator

Male Posts : 5140
Reputation : 478
Language : English
Location : USA

http://broadcastingduo.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