/    Sign up×
Community /Pin to ProfileBookmark

need to adjust FF2 and IE to look like FF3

Copy linkTweet thisAlerts:
Jun 11.2008

Hey all, i have some CSS issues with my website.

here is a print screen from FF 3 RC2:

[IMG]http://img505.imageshack.us/img505/188/capturekh6.png[/IMG]

and that’s what i want to accomplish in all the other browsers.

but, in FF 2 it looks like this:

[IMG]http://img341.imageshack.us/img341/6711/66tm1.jpg[/IMG]

and in IE it looks like this:

[IMG]http://img516.imageshack.us/img516/7000/77li5.jpg[/IMG]

I don’t get where those black dots are coming from..

<div class=”centry”>
// code that calls the thumnbnails
</div>

CSS related:

.centry a:link img, .centry a:visited img, .centry a:hover img,
.centry a:active img {
background: none;
padding: none;
border: none;
margin-right:5px;
margin-bottom:5px;
width: 60px;
height:60px;
float:left;

Thanks

to post a comment
CSS

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@WebJoelJun 11.2008 — Without seeing the whole code or URL, -I assume that the 'image' is the clickable link? Adding "outline:none;" sometimes fixes this, that 'little outline' you get on image-anchors on-hover/on-active...

The little black dots are 'list-style'. To "li" add "[B]list-style-type:none;[/B]"

While seeing the images posted is nice, to be really helpful, seeing the code is required (all of it).
Copy linkTweet thisAlerts:
@namoothauthorJun 11.2008 — I tried adding outline:none; to my css but its still the same.

I didn't gave a URL because i removed the code from there (it messes up my site in browsers other than FF3) But i can write here any peace of my code that can help.
Copy linkTweet thisAlerts:
@WebJoelJun 12.2008 — I tried adding outline:none; to my css but its still the same.

I didn't gave a URL because i removed the code from there (it messes up my site in browsers other than FF3) But i can write here any [B]peace[/B] of my code that can help.[/QUOTE] Then, do it. ? It's probably a typo somewhere (like "peace" instead of "piece"...? )

Also, while "padding:none;" works, it really should be either omitted, or "padding:0;"
Copy linkTweet thisAlerts:
@CentauriJun 12.2008 — Looks like classic results from a mixture of display modes for <li>s and <a>s within a list. For best cross-browser capatability, float [B]both[/B] the <a>s and <li>s and set the list style on the <li>s to "none".

Full code and css of the list will help diagnose the problem (or better still, a small example uploaded to a tempory location online, so we have the images to work with).
×

Success!

Help @namooth spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.2,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...