Here is the code I am using:
.customBulletList {
list-style-image: url(images/bullet.png);
}
The weird thing is that it shows up in Firefox, Chrome, Safari, and Opera. Is this CSS property not supported in IE or something?
Thanks in advance.
it is implemented. Probably it's problem of margins, padding, that are counted wrong and put image outside visible area.
Use a background-image instead (with additional padding to the left) and set list-style to none.
I belive that IE6 does not supportlist-style-image!
Add padding-left to the ul css style. That may bring the bullets into view. Try 40px and work from there. If you put a temporary border on the ul you can see where the bullets are getting chopped.
Related
The vertical submenu shows fine in all browsers but not in IE7 when I hover over “Diensten”.
see the website
Can anyone help me
Its not fine even in IE9. Fix the position absolute top 1.68em for the #access ul ul
am i right that you are using css3pie? If yes, try to remove it first, does it work now?
Yes It works little bit, when I remove Pie. See website.
But I cannot use rounded corners with css3 on IE7 and IE8.
When I use clear:both code in CSS div tag it doesn't show correctly on IE.
this is firefox:
this is IE 6
You can see in firefox it's show correctly, But IE 6 it doesn't show correctly. Please help me to solve this problem. Thank you.
Please check this.
http://jsfiddle.net/sasindu555/xmKAT/
add font-size: 0; to #h-spacer
IE6 can't make a 1px high div it defaults to 16px(or default) height to leave room for text line-height
I have this small testcase: http://jsfiddle.net/sV8js/
You can see that in Chrome (tested on win7 11.0.696.68) the first 2 links right border is "cut off" and is not shown. FF and IE 7/8/9 seem to show it OK.
Browsershots: http://browsershots.org/http://top3skills.com/1.html
Also "buggy" on Safari (so it's webkit related?)
Anyone knows what's the problem with this approach or how to solve this?
(or if I should report a bug to chrome) Any workaround that doesn't affect other browsers?
Also, my testcase is different from Right border not displaying on google chrome but maybe it's the same bug?
Updated: I don't want to use inline-block as IE7 doesn't support it and I'm finding this bug because I'm removing the inline-block I previously had there :) Also this is dynamic so it's not easy to add after each link because some links can break to a new line, others don't... so I'm trying first to get the "right way" and then resort to more "tricky" ways.
You have set the containing DIV at a fixed width of 250px. This is cutting off the edges. Also, you should add display:inline-block; to your CSS link class. This will make your link a block element while keeping it inline. It will also apply the padding you have asigned properly.
See updated link here http://jsfiddle.net/sV8js/12/
Dan
Try giving those links a display: inline-block or display: block property, as links are inline elements.
you need to add display: block to .referencesSkills
Can you check this page and let me know why the menu doesn't work on IE7? It shows up all the way on the right, almost out of view.
The page works okay in other browsers (including IE8 and IE9). Thanks.
Change postition:absolute; to position:relative; in your #top-nav css ID. That will fix the position for you. After that remove position:absolute; from #top-nav li p and it will display correct.
I suggest you to download Developer Tools for IE. It helps you alot with HTML/CSS related problems when using IE.
Because you have ul#top-nav set to display:none ?
If not that, try playing with position:absolute, you have there all over the place... IE may have issues concerning that.
I've been trying to modify the following menu to make it look indentical in IE, Firefox, and Safari/Chrome but I can't seem to get it to look right in Safari/Chrome.
Could anyone tell me how to fix it? When viewed in Safari or Chrome, notice that the menu is ignoring the padding.
View flickr-like menu
Thanks in advance!
Padding on elements that are or are displayed as inline. http://www.maxdesign.com.au/presentation/inline/
Try making the inline elements inline-block in order to get the padding working properly.