Ordered and unordered list NOT working when viewing as article

messo
(@messo)

15 years, 6 months ago

The problem: Ordered and unordered list does not show correctly in articles, but works fine on the front page. See for yourself, and give your opinion on what it can be.

Test the following on this theme: http://wordpress.org/extend/themes/tropicala

1. Click the Preview button on this theme and look at the HTML article where the ordered and unordered list are shown. Notice that they are showing correctly.

2. Click the “HTML” title to view the text as an article / page, and notice that the ordered and unorderes list are formated in a totally different way!

I have searched the CSS and PHP theme files for hours, but can’t find the out what’s causing this. So far I have found out that something in the code overrides the style.css theme file, but I don’t know what, and why.

The strange thing is that it shows perfectly at the frontpage, but not in “article” mode. Why? It’s the same style.css file. Something must be different in article mode, but I can’t figure out what it is.

It may be a simple thing – I’m no expert on code. If anyone with a little experince could look into this, I would be very greatful!

Thanks in advance 🙂

EDIT: Tested in the most recent version of Safari and Firefox

Viewing 15 replies - 1 through 15 (of 20 total)

1 2 →

Thread Starter messo
(@messo)

15 years, 6 months ago

I have not found any soloution to this weird error yet. I know to little about css / php to track down the problem, I think 🙁

sensibilitypatterns
(@sensibilitypatterns)

15 years, 6 months ago

I’m having the same problem. My unordered list shows the bullet points in the WYSIWYG editor, but the bullets don’t show when I preview the page or publish it. I guess I’ll resort to using asterixes. 🙁

If you find a fix, I’d love to know about it.

Thanks!

zeniph
(@zeniph)

15 years, 6 months ago

the below will resolve for you

in style.css:
change line 187 to this:
.article ul, .article ol, .post ul, .post ol {

change line 193 to this:
.article ul li , .post ul li {

The theme’s CSS had disabled all list bullets – unless they were explicitly told to display they didnt. The above tells lists inside the .post DIVs to display the same way as those found within the .article DIVs

Thread Starter messo
(@messo)

15 years, 6 months ago

Awsome! Now my bullets work! Thank you so much 🙂 I tried to fool around with those lines, but obviosly did’nt do it rigth.

One more thing. The “cite” function have the same problem as the bullets did. It looks fine in WYSIWYG, but on the site its shown as normal text. Can this also have have been disabled in the css?

zeniph
(@zeniph)

15 years, 6 months ago

no prob

apart from the global margin, padding etc reset there’s no CSS specifically for CITE tag – just looks like normal italic text to me which I think is how the theme’s author intended it.

Thread Starter messo
(@messo)

15 years, 6 months ago

Thanks, I will look into it. Sounds like something I can fix myself 🙂

hive101
(@hive101)

15 years, 2 months ago

Thank you zeniph for posting this fix. I had the same issue and was relieved to find a solution!
carol7
(@carol7)

15 years, 1 month ago
Hi, I’m having the same problem and I can’t find the code referenced in the solution above in the style sheet. The theme is “Ikarus White.”

I’m trying to create unordered bulleted lists in pages and postings. Not sure if the issue is in the code below or is it something else entirely?
```
/* Small text */
small, .small, .smalldark, .mosimage_caption, .createdate {
	color: #666666;
	font-size: 80%;
}
p, pre, blockquote, ul, ol, h1, h2, h3, h4, h5, h6 {
	margin: 15px 0;
	padding: 0;
}
ul {
	list-style: none;
}
ul li {
	padding-left: 10px;
	line-height: 180%;
}
ol li {
	margin-left: 35px;
	line-height: 180%;
}
```
t31os
(@t31os)

15 years, 1 month ago
The list style is set to none here look..
```
ul {
	list-style: none;
}
```
Either remove it or change to..
```
ul {
	list-style: disc;
}
```
Disc is default…..

Possible values..

none
disc
circle
square
decimal
decimal-leading-zero
lower-roman
upper-roman
lower-alpha
upper-alpha
lower-greek
lower-latin
upper-latin
hebrew
armenian
georgian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
carol7
(@carol7)

15 years, 1 month ago

t31os, thanks for the answer. Before seeing your response, I experimented with the html code on the page and found that if I removed the <ul></ul> tags around the list the bullets displayed….not sure what is in the style sheet that makes it work that way. Thanks again for replying =)
t31os
(@t31os)

15 years, 1 month ago
It may not be advisable to remove those from the HTML, since you could be generating half built lists… or non-valid code…

The suggestion i gave before would resolve the problem without causing any problems…

This part in style.css
```
ul {
	list-style: none;
}
```
Is basically saying set the list style to NONE for all UL lists…

All you need do is remove those lines or change them, as per my previous suggestion.
carol7
(@carol7)

15 years, 1 month ago

t31os I tried and what you suggested works, but the way this theme (Ikarus) is written it added a second set of bullets to a sidebar list of blog pages that already had bullets 🙁

I don’t know enough css to fix it so that it defines page and post bullets separately from the theme’s sidebar bullets. I set the value back to “none” until someone can help me with this.

t31os
(@t31os)

15 years, 1 month ago

Can you provide a link to your site?

carol7
(@carol7)

15 years, 1 month ago

It’s qeangroup.com/blog/
You’ll see the theme-provided bullets on the right in the sidebar area labeled “Pages.”
Thanks =)
t31os
(@t31os)

15 years, 1 month ago
Get rid of this…
```
ul {
	list-style: none;
}
```
And add this instead…
```
#colwrap ul {
	list-style-type:none;
}
```
If that doesn’t work then try…
```
#colwrap ul {
	list-style-type:none!important;
}
```
That will remove the list bullets off any list items in the sidebar areas without effecting anywhere else..