I have just built a new website in Joomla, it is fine in every other browser but firefox where some of the text is blurry - like the font shadow has further offset.
I have recently built a new website using Joomla. It is appearing perfectly in all browsers except Firefox - not just on my computer as others have emailed me to tell me of the problem. The text at the top menu bar, drop down menus and bottom menu bars is appearing blurry - like the shadow is too far offset. This shadowed text was part of the joomla template and is in the CSS style sheets of the template - it is fine on any other browser - I did try taking the shadow out in the CSS sheet but this did not fix it either. The site is at www.hugsnkisses.net
All Replies (3)
Your problem lies in these two lines:
- text-shadow: 0 1px 0 #FFFFFF, 0 0 2px #666666; (http://www.hugsnkisses.net/ line 150 ul.menu_lv_dropdown)
- text-shadow: 0 1px 0 #000000, 0 0 1px #000000; (http://www.hugsnkisses.net/templates/allrounder_v1.2/css/template.css line 136#navigation)
thankyoiu for your answer Matt2 - but tried finding these references (could only find one) and changing text shadow to 0px - no fix - tried changing every single text shadow to 0px in every css folder - no fix? What am I supposed to change where? Still dont really get why its fine in every other browser but firefox either - if i do change it in the CSS sheets will it be okay in every other browser then?
In template.css, you need to remove your textshadow from #navigation.
http://www.hugsnkisses.net/templates/allrounder_v1.2/css/template.css line 136, it says:
#navigation {
background-position:center top;
background-repeat: no-repeat;
height: 40px;
height:auto;
margin:auto;
background-color: #fff;
color: #ccc;
text-shadow: 0 1px 0 #000, 0 0 1px #000;
}
that won't do anything unless you also remove it from index.php line 150.
ul.menu_lv_dropdown {
background:#ABBDD1 !important;
text-shadow: 0 1px 0 #fff, 0 0 2px #666;
border-top: 1px solid #7A92A5;
border-bottom: 1px solid #7A92A5;
}
Modified by cor-el