Return to previous page

List style text align on small devices - by Marcel Weber

This topic has 14 replies, 3 voices, and was last updated 9 years, 10 months ago ago by Robert Hall

Marcel Weber

Participant

January 20, 2016 at 13:45

Dear 8theme-team,

We’re running into a problem with lists: If a list item consists of a long text that is running over more than two lines the indent on the left doesn’t align nicely with the two lines above (occurs especially on smartphones where a list item needs more lines than on a desktop screen).

Please have a look at http://www.hanstenbrinke.nl/bedrijfsroutes/
Scroll down to ‘MAPPA Consult biedt u’ and you will see the bullets list in the right colomn.

We saw that the align-problem also occurs on the Legenda demo site https://www.8theme.com/demo/legenda/shortcodes/1768-2/

Could you pelase help to fix this?

Thanks in advance,
Marcel

#108892 Copied

13 Answers

Eva Kemp

Participant

January 20, 2016 at 15:29

Hello,

As I see list is shown properly:
http://storage3.static.itmages.com/i/16/0120/h_1453300154_6781290_81c9d70b2d.png

Could you please show a screenshot for better understanding?

Regards,
Eva Kemp.

#108941 Copied

Marcel Weber

Participant

January 20, 2016 at 15:39

Dear Eva,

Thank you for the quick reply. The image of the list you’ve send us shows what we mean: It’s about the third list item. As you can see the third line of this item starting with ‘passende’ doesn’t align with the rest of this and the other list items. This is a general thing that occurs with list-item-texts longer than two lines.

Your help is very much appreciated.

Thanks in advance.

Regards,
Marcel

#108946 Copied
Robert Hall

Participant

January 20, 2016 at 20:15
Hello,

Please add the following code in custom.css file

.list li:before{ position: absolute; left: 0px; } .list li { position: relative; padding: 5px 0 5px 20px; }

Here is a video tutorial how to create custom.css: https://www.youtube.com/watch?v=Qok2zRedRMY&feature=youtu.be.

Regards,
Robert Hall.
#109054 Copied
Marcel Weber

Participant

January 21, 2016 at 11:01

Thank you very much, Robert. This solved the problem!
We have one more thing we need you help for. It occurs on the site:
http://www.mappamaps.nl/

When viewed vertically on an ipad the search button doesn’t appear in the top bar.

Could you please advise?

Thanks in advance,
Marcel

#109145 Copied
Robert Hall

Participant

January 21, 2016 at 11:30
Hello,

Please add this code in custom.css file and check it.

@media (max-width: 979px){ .top-bar .search { display: block !important; } }

Regards,
Robert Hall.
#109162 Copied
Marcel Weber

Participant

January 21, 2016 at 12:22

Thank you, Robert. The search button now appears on the vertical ipad viewport. It just doesn’t look very nice. Is it possible to switch to the next (smaller) step viewport-version with the logo centered as shown in the attached screenshot and not to have the ugly step in between?

https://drive.google.com/file/d/0B_wIqx1dRjJZZXRCTkg2YlZQWWc/view?usp=sharing

Thank you in advance,
Marcel

#109173 Copied

Robert Hall

Participant

January 22, 2016 at 11:30

Hello,

Please provide us with wp-admin access in Private Content.

Regards,
Robert Hall.

#109406 Copied

Marcel Weber

Participant

January 25, 2016 at 09:33

Here you are.

Thank you in advance.

Please, contact administrator
for this information.

#109750 Copied

Robert Hall

Participant

January 25, 2016 at 17:06

Hello,

Your credentials aren’t correct. Please check them.

Regards,
Robert Hall.

#109877 Copied

Marcel Weber

Participant

January 25, 2016 at 17:13

Sorry, here you are again. This should work.

Thank you!

Please, contact administrator
for this information.

#109880 Copied
Robert Hall

Participant

January 25, 2016 at 17:32
I’ve added this code in style.css file of the Child Theme. Please check.

@media (max-width: 979px) and (min-width: 768px){ .top-bar .search { position: relative !important; right:0px !important; } .header .logo img { position: relative; left: 50%; margin-left: -150px; } }

Regards,
Robert Hall.
#109888 Copied
Marcel Weber

Participant

January 25, 2016 at 17:44

Thank you very much! Works like a charme.

#109893 Copied

Robert Hall

Participant

January 25, 2016 at 18:00

You’re welcome!

Regards,
Robert Hall.

#109895 Copied
Viewing 14 results - 1 through 14 (of 14 total)