Li out of aling & unclickable

Printable View

06-08-2020, 08:31 AM
theremotedr

Li out of aling & unclickable

Morning,
Ive noticed on my site a few items that have an issue.
This issue being as follows.

Here is an example https://www.theremotedoctor.co.uk/ho...rollto=content
Pc looks fine & work as it shoul but when viewing on a mobile the line of text Read My Facebook Feedback is centered as opposed to being aligned left.
Also the sequence of the rotating options should be,
1, HISS CABLE RED
2, HISS CABLE BUNDLE
3, Read My Facebook Feedback

But what you see is only 1 & 2 as 3 is missed completly thus not being able to click on it.

Looking through my site there are a few pages that have this issue but i cant track down why its happening or a fix for it.

Many thanks.
06-08-2020, 03:01 PM
coothead

Hi there theremotedr,

This code-( starts at about line #229 )..

Code:

<div id="ul-holder"> <ul> <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/HONDA-HISS-CABLE.jpg', 'HISS CABLE RED','£24.99 To Programme Another Key You Must Have a working Key Before Starting UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">HISS CABLE RED</a></li> <li onclick="replaceMainImage('m-images/photos/HONDA-HISS-CABLE-SET.jpg', 'HISS BUNDLE SET','£44.99 To Programme Another Key You Must Have a working Key Before Starting UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">HISS BUNDLE SET</a></li> <li class="licenter"><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" id="rmfb" target="_blank">Read My Facebook Feedback</a></li> </ul> <div id="cover-top"></div> <div id="cover-bottom"></div> </div>

...should be...

Code:

<div id="ul-holder"> <ul> <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/HONDA-HISS-CABLE.jpg', 'HISS CABLE RED','£24.99 To Programme Another Key You Must Have a working Key Before Starting UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">HISS CABLE RED</li> <li onclick="replaceMainImage('m-images/photos/HONDA-HISS-CABLE-SET.jpg', 'HISS BUNDLE SET','£44.99 To Programme Another Key You Must Have a working Key Before Starting UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">HISS BUNDLE SET</li> <li><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" target="_blank">Read My Facebook Feedback</a></li>  <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/HONDA-HISS-CABLE.jpg', 'HISS CABLE RED','£24.99 To Programme Another Key You Must Have a working Key Before Starting UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">HISS CABLE RED</li> </ul> <div id="cover-top"></div> <div id="cover-bottom"></div> </div>

coothead
06-08-2020, 04:12 PM
theremotedr

Hi
Thanks door that.

Could you please highlite it in red.

Have a nice day.
06-08-2020, 05:07 PM
theremotedr

I ask because the next page of which is https://www.theremotedoctor.co.uk/ac...llto=selection
The line Smart Remote Uncut Key is the issue.

I am trying to see the pattern so i can tackle each one
06-08-2020, 07:33 PM
coothead

Hi there theremotedr,

on that page you've added 3 "li elements" instead of 2;

Code:

<div id="ul-holder"> <ul> <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/AUDI002.png', 'Audi002','£4.00 Fix That Damaged Remote Easy To Swap Over T5 & T6 Screwdriver Is Required UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Flip Remote Key Pad</li> <li onclick="replaceMainImage('m-images/photos/AUDI006.png', 'Audi006','£8.00 Key Will Require Cutting Emergency Key UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Smart remote uncut key</li> <li onclick="replaceMainImage('m-images/photos/AUDI005.png', 'Audi005','£8.00 Chip Will Require Programming With Diagnostic Tool UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Virgin Can Bus Chip ID48</li> <li><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" target="blank">Read My Facebook Feedback</a></li> <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/AUDI002.png', 'Audi002','£4.00 Fix That Damaged Remote Easy To Swap Over T5 & T6 Screwdriver Is Required UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Flip Remote Key Pad</li>  </ul> <div id="cover-top"></div> <div id="cover-bottom"></div> </div>

coothead
06-09-2020, 08:48 AM
theremotedr

1 Attachment(s)

Im either getting confused or something else is happening.

Below is the partial code in use.
You say 2 li must be repeated.
So below the first 2 li are shown.
Any li after these and other pages must be deleted correct ?

Still i look at my page but a line is still out centered as opposed aling to the left.
See attached screenshot

Code:

1st li <li><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" target="blank">Read My Facebook Feedback</a></li> 2nd li <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/AUDI002.png', 'Audi002','£4.00 Fix That Damaged Remote Easy To Swap Over T5 & T6 Screwdriver Is Required UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Flip Remote Key Pad</li> </ul> <div id="cover-top"></div> <div id="cover-bottom"></div>
06-09-2020, 09:37 AM
coothead

Hi there theremotedr,

Does this make it clearer...

Code:

<div id="ul-holder"> <ul> <li><a href="#home">Return To Menu</a></li> <li onclick="replaceMainImage('m-images/photos/AUDI002.png', 'Audi002','£4.00 Fix That Damaged Remote Easy To Swap Over T5 & T6 Screwdriver Is Required UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Flip Remote Key Pad</li> <li onclick="replaceMainImage('m-images/photos/AUDI006.png', 'Audi006','£8.00 Key Will Require Cutting Emergency Key UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Smart remote uncut key</li> <li onclick="replaceMainImage('m-images/photos/AUDI005.png', 'Audi005','£8.00 Chip Will Require Programming With Diagnostic Tool UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Virgin Can Bus Chip ID48</li> <li><a href="https://www.facebook.com/www.theremotedoctor.co.uk/posts_to_page/" target="blank">Read My Facebook Feedback</a></li>  <li><a href="#home">Return To Menu</a></li> <li id="lindent" onclick="replaceMainImage('m-images/photos/AUDI002.png', 'Audi002','£4.00 Fix That Damaged Remote Easy To Swap Over T5 & T6 Screwdriver Is Required UK Recorded £4.00 International Signed For £10.00 Posted From The UK The Remote Doctor')">Flip Remote Key Pad</li>  </ul> <div id="cover-top"></div> <div id="cover-bottom"></div> </div>

Now add this...

Code:

#lindent { text-align: left!important; }

...to your latestChanges.css file.

coothead
06-09-2020, 10:03 AM
theremotedr

Hi,
Yes so ive added the line to the css now.

So i need to go through my pages and in the mobile phone code section i should be looking for.& making sure that the .....

1st li will be Return To Menu
2nd will be id="lindent" etc etc

Followed by </ul>

This should be the same for pretty much all my site as the skeleton code was used over & over.
06-09-2020, 10:13 AM
coothead

That should do the trick. ;)

coothead