Support Forum
Support Forum
Offline
Hey guys I was wondering how to align the avatar with the text in the recent forum post widget that is used with the template and tags widget.
here is the current look:
This is what i am trying to make it look like:
Or even how you guys have it here in the footer of the simplepress website:
Thanks for any help in advanced!
|DEVELOPER|GAME DESIGNER|GRAPHIC ARTIST|HOMEBREW|MUGEN|XMUGEN|UNITY 3D|
Offline
just add some css... easiest way is to inspect the css with your browser... in our case, its:
#spRecentPostsTag .spAvatar {
float: left;
margin-top: 5px;
padding-bottom: 20px;
}
you would add that to your wp theme since the forum css may not be available...
Visit Cruise Talk Central and Mr Papa's World
Offline
hi @mr-papa
i followed this and this was the result -->
need help on how to:
1. Put space between the avatar and the first word of the post title
2. Decrease line-spacing between the first and second line of the post title
3. Username and time posted on the 3rd (or 2nd) line, depending on the length of the post title
thanks!
Offline
Well the avatar spacing is an easy one, we roughly use:
#spRecentPostsTag .spAvatar {
float: left;
padding-bottom: 20px;
margin: 5px 10px 0 0;
}Although you can change those values to be more appropriate to your needs, you might not need 20px padding at the bottom for example so you'll have to experiment.
As for the line spacing we'd really need to take a look. I don't think we put anything in as standard other than line height so more than likely your WP theme is imposing some styling. It would be almost impossible to tell what without taking a look - Can you post a link?
As for making sure username drops down a line, you should be able to add a
to the widget in the 'After Topic Text' box. This will insert a line break meaning the next div created will appear underneath the previous one.
Offline
hi @ike
i got it to look like this -->
just need to reduce line-spacing and align the 3rd line to the 1st and 2nd.
here is my site --> http://hoops.ph
Offline
Good start!
It looks like your WP theme is using:
.widget li {
line-height: 30px;
list-style: outside none none;
}So, first thing to try is:
#spRecentPostsTag .spListItemTag {
line-height: 1.3em;
}This might not work, but first thing to try. I tried changing your themes 30px line height and it looked like it caused a few problems, doesn't bode well!
Offline
hi @ike
this is the result -->
so the line spacing is solved and the 3rd line is now aligned. only the space and alignment between the posts...
Offline
That's what I was afraid of - The WP theme is doing something odd. Can you try adding a display rule to the .spListItemTag rule I posted above? Change it to:
#spRecentPostsTag .spListItemTag {
line-height: 1.3em;
display: inline-block
}However, there is still no break between the title and the author. Have you added that yet?
Offline
you nailed it @ike! this is exactly the way i wanted it to be -->
thank you so much! 🙂
keep up the good work of helping others!
Offline
glad we could help... on to the next one... 😉
Visit Cruise Talk Central and Mr Papa's World
All RSS1 Guest(s)