Log in

View Full Version : Resolved Dr down list bleeds showing background



theremotedr
02-13-2016, 12:52 PM
Morning,

Please use this page http://www.theremotedoctor.co.uk/index.html
Click on Accessories please.
Im trying to stop the background bleeding through between each option, bmw-fiat fiat-ford etc etc.
When looking on the phone it shows up a bit more.
Ive looked this morning for why it does this but cant put my finger on it.
Working through the Basic css srt menu, ul li,options ive started at the begining and worked through to the end changing border px,background colour etc etc hoping to see a change after each edit on the phone but no such luck.
Using Firebug to pin point the issue also did not help me.
Whilst in Firebug i added/change the code but it did not reflect on what i was trying to find,this could not be done on all of them ad some had a line going through them.
Ive spent 2 hours looking before i posted this here.
Here is a screen shot from the phone showing what i need to sort.

5819

styxlawyer
02-13-2016, 01:10 PM
It looks fine on my browser:

5820

You may still want to address these problems (https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.theremotedoctor.co.uk%2Findex.html).

theremotedr
02-13-2016, 01:24 PM
Hmmm Strange.
So as you can see the gaps between each field option where do you see the line in the css file where i can each close the gaps, or if say its a transparent border etc add a colour to it.
That way it should work.

Regarding the other problem i need to end my list and then look at them.

styxlawyer
02-13-2016, 04:09 PM
This should hide the top and bottom borders and leave the left and right ones as they are for each link in the list:



#secondary-navigation ul li a{
background:#E6E6E6;
display:block;
margin:5px 0;
padding:10px;
text-decoration:none;
border-style: hidden solid;
border-width: 1px;
border: #5d0e13;
box-shadow:#000 4px 4px 8px
}

theremotedr
02-13-2016, 05:00 PM
Thanks for the input but that code supplied didnt make any changes.
This is what you advised,

background:#E6E6E6;
display:block;
margin:5px 0;
padding:10px;
text-decoration:none;
border-style: hidden solid;
border-width: 1px;
border: #5d0e13;
box-shadow:#000 4px 4px 8px
This morning using the W3schools try it editor.
I used my original code but made a few edits.
Each edit i made one at a time was shown perfect on there editor.
The only only that caused an issue was border: #5d0e13; so i left it out.
Having the code below working in there editor i thought i cracked it,sorry to say but when i put it in my basic css line 153 that also had made no changes ???
I think there must be something else controlling this.


border-style: solid;
border-color: #000000;
background:#E6E6E6;
display:block;
border-width: 10px;
margin:5px 0;
padding:10px;
text-decoration:none;
box-shadow:#000 4px 4px 8px