Spaces in Ordered and Unordered Lists?

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Spaces in Ordered and Unordered Lists?

Post by rick5150 »

Is there a way to insert spaces between the list items of a bulleted or numbered list? My posts look very cluttered when everything is tightly packed in a list.
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian
Contact:

Re: Spaces in Ordered and Unordered Lists?

Post by PlanetStyles.net »

Hello Rick! :)

There certainly is. Could you post a screenshot of the specific part you'd like to space out? It's likely to be a one-line CSS edit.

Thanks :)
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Re: Spaces in Ordered and Unordered Lists?

Post by rick5150 »

Thank you!

Here is how it looks now:
spacing-001.jpg
spacing-001.jpg (51.88 KiB) Viewed 2804 times
Here is about how I wanted it to look:
spacing-002.jpg
I was hoping it could be done as BBCode so I can add spaces only when I need to, and that if I had a list of 30 items, I could keep it tight. For example, I added the horizontal rule BBCode and if I put a horizontal rule between the bullet points, the spacing is nearly perfect - but I do not want the horizontal rule itself, just the space.
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian
Contact:

Re: Spaces in Ordered and Unordered Lists?

Post by PlanetStyles.net »

Sounds simple enough. Which would you rather was the default behaviour?

Spaced out list, but a BBCode that can be used for making it compact again?

Thanks :)
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Re: Spaces in Ordered and Unordered Lists?

Post by rick5150 »

Thanks!
I think it would be easiest to leave the default as is and just space it out as needed.
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Re: Spaces in Ordered and Unordered Lists?

Post by rick5150 »

On second thought, if the spacing is changed to the default behavior, then that should change all of the posts I have already made without me having to edit them, right?

My concern is that a long list that I do not want to have spaced would be tedious if you have to enter a non-space code between each entry, wouldn't it?
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian
Contact:

Re: Spaces in Ordered and Unordered Lists?

Post by PlanetStyles.net »

Hi again Rick!

Apologies for the delay.
rick5150 wrote: Sat Jan 21, 2017 8:14 pm if the spacing is changed to the default behavior, then that should change all of the posts I have already made without me having to edit them, right?
Correct.

As for the spacing, whatever default behavior you choose, a BBCode will be used to set special spacing on the lists you want to change, so there shouldn't be a need to enter any hacky non-spaces etc :)
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Re: Spaces in Ordered and Unordered Lists?

Post by rick5150 »

Awesome! Thank you and I look forward to seeing what you come up with.
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian
Contact:

Re: Spaces in Ordered and Unordered Lists?

Post by PlanetStyles.net »

Let's roll with normal spacing as default, then use a BBCode to expand long lists.

In ACP -> Posting -> BBCodes -> Add BBCode:

BBCode:

Code: Select all

[longlist]{TEXT}[/longlist]
HTML Replacement:

Code: Select all

<div class="longlist" style="line-height: 3em;">{TEXT}</div>
----------------------------------

Alternatively you can use this as the HTML replacement:

Code: Select all

<div class="longlist">{TEXT}</div>
and then add this to the bottom of common.css:

Code: Select all

.longlist ul li, .longlist ol li {
	line-height: 3em;	
}
The latter option is a bit more child-proof and stops people wrapping the [longlist][/longlist] BBCodes around things that aren't lists. But, means each time you update prosilver you need to add that to the bottom again.


----------------------------------


Usage:

Code: Select all

[longlist]
[list]
[*]These bullets are
[*]Nicely
[*]Spaced out
[/list]
[/longlist]
Preview:
download.png
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Re: Spaces in Ordered and Unordered Lists?

Post by rick5150 »

Thank you. I just had a chance to try this out today. It works for very short lists, but when I have lists that span more than one line, it looks sloppy because not only are there spaces between the bulletpointed items, there is also space between each line in the bulletpointed items so this paragraph would look like this:


Thank you. I just had a chance to try this out today. It works for very short lists, but when I have lists that

span more than one line, it looks sloppy because not only are there spaces between the bulletpointed

items, there is also space between each line in the bulletpointed items so this paragraph would look like

this:

Not sure if this makes sense, so I can get you a screenshot if needed.
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: Spaces in Ordered and Unordered Lists?

Post by Hanakin »

hi don't use the first option that was provided. use the custom css class one as stated you have far better control to target the child elements. If you use the second method with the custom class this should not happen if you change to the custom class from line-height to the following

Code: Select all

	margin-bottom: 1.5rem;
Jeeshman
Registered User
Posts: 2
Joined: Thu Mar 23, 2017 3:29 pm

Re: Spaces in Ordered and Unordered Lists?

Post by Jeeshman »

Christian 2.0 wrote: Tue Jan 24, 2017 12:57 am Let's roll with normal spacing as default, then use a BBCode to expand long lists.
Long-time lurker, first-time poster. I'm reviving this discussion because I have a similar-yet-different question. The former version of phpbb let me create lists and manually insert blank lines between list items. But 3.2 isn't letting me do that; no matter how many times I hit Enter between list items, it's still displaying them without any space between them. So:

[list=1]
[*] This is the first thing.
[*] This is the second thing.
[/list]


looks the same as:

[list=1]
[*] This is the first thing.


[*] This is the second thing.
[/list]


When what I want is for the second list to have spaces between the first and second things, like so:

1. This is the first thing.

2. This is the second thing.

And not:

1. This is the first thing.
2. This is the second thing.

I don't want to change the regular manner in which the boards treat lists; I just want to be able to manually insert blank lines between list items on occasion. Is there still a way to do that, or am I going to have to manually edit the style sheet as you described? Which... ugh. That seems like a lot of work to do something that used to be automatic.
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: Spaces in Ordered and Unordered Lists?

Post by Hanakin »

the BBCODE parser was overhauled and it no longer allows for this -> https://area51.phpbb.com/phpBB/viewtopi ... 23&t=44467
Jeeshman
Registered User
Posts: 2
Joined: Thu Mar 23, 2017 3:29 pm

Re: Spaces in Ordered and Unordered Lists?

Post by Jeeshman »

Hanakin wrote: Thu Mar 23, 2017 5:03 pm the BBCODE parser was overhauled and it no longer allows for this -> https://area51.phpbb.com/phpBB/viewtopi ... 23&t=44467
Thanks for the reply. That's too bad for lists that are made up of paragraphs, because once there are 3 or more entries it just looks like a gigantic wall of text.
rick5150
Registered User
Posts: 283
Joined: Wed Feb 02, 2005 6:19 pm

Re: Spaces in Ordered and Unordered Lists?

Post by rick5150 »

When I added the code to the style sheet, instead of getting bullets, I am getting the actual [*] in both ordered and unordered lists. All my numbers are now [*]. What did I do wrong?
Post Reply

Return to “[3.2.x] Styles Support & Discussion”