The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

How do I make a message divider taller?

5 posters

Go down

Solved How do I make a message divider taller?

Post by Kamui 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.

How do I make a message divider taller? 36fd240d0aa70d5ce446b4907bec0b50


Here's an example of what I mean.

How do I make a message divider taller? E99081cc1c7220263a37b5508b7021ee


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

Male Posts : 291
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 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
Van-Helsing
Hyperactive

Male Posts : 2431
Reputation : 116
Language : English, Greek

http://itexperts.forumgreek.com/

Back to top Go down

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

Post by Sir Chivas™ 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.
Sir Chivas™
Sir Chivas™
Helper
Helper

Male Posts : 6983
Reputation : 457
Language : EN, FR, ES
Location : || CSS || HTML || Graphics Designs || Support ||

https://aforums.org

Back to top Go down

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

Post by Kamui 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
Kamui
Forumember

Male Posts : 291
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 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
Van-Helsing
Hyperactive

Male Posts : 2431
Reputation : 116
Language : English, Greek

http://itexperts.forumgreek.com/

Back to top Go down

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

Post by Kamui 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
Kamui
Forumember

Male Posts : 291
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 March 15th 2016, 5:58 pm

@Kamui do you have you twice the element .pun .posthead in your css?
Van-Helsing
Van-Helsing
Hyperactive

Male Posts : 2431
Reputation : 116
Language : English, Greek

http://itexperts.forumgreek.com/

Back to top Go down

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

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

I'm not sure what you mean.
Kamui
Kamui
Forumember

Male Posts : 291
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 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:

How do I make a message divider taller? CASxc6A


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

Male Posts : 2431
Reputation : 116
Language : English, Greek

http://itexperts.forumgreek.com/

Back to top Go down

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

Post by SLGray 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;
}


How do I make a message divider taller? Slgray10

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

Male Posts : 51533
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

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

Post by Kamui 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
Kamui
Forumember

Male Posts : 291
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 March 16th 2016, 2:14 am

Hello @Kamui,
Try this code:

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

Male Posts : 2431
Reputation : 116
Language : English, Greek

http://itexperts.forumgreek.com/

Back to top Go down

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

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

Finally, it works. Thanks a lot man How do I make a message divider taller? 1f60e you some how keep coming through. I appreciate all the help you and everyone has given today!
Kamui
Kamui
Forumember

Male Posts : 291
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 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
Van-Helsing
Hyperactive

Male Posts : 2431
Reputation : 116
Language : English, Greek

http://itexperts.forumgreek.com/

Back to top Go down

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

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

How do I make a message divider taller? 1f600 Thanks!
Kamui
Kamui
Forumember

Male Posts : 291
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 March 16th 2016, 5:35 pm

Thanks for the help Van-Helsing Very Happy.

Topic solved and archived ~ brandon_g


How do I make a message divider taller? Brando10
Remember to mark your topic How do I make a message divider taller? Solved15 when a solution is found.
General Rules | Tips & Tricks | FAQ | Forgot Founder Password?

How do I make a message divider taller? Scre1476
Team Leader
Review Section Rules | Request A Review | Sticker Points
brandon_g
brandon_g
Manager
Manager

Male Posts : 10112
Reputation : 923
Language : English
Location : USA

https://www.broadcastingduo.com

Back to top Go down

Back to top

- Similar topics

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