Firefox / IE differences! (CSS?)

Hello all:
I have been staring at my monitor for the last 8 hours
working on this and I can't figure it out. Long story short, I'm in
the middle of creating a simple website and what started as a
simple desire to use a Dreamweaver library for my navigation bar
has become a full blown mission of being browser compatible. Please
take a look at the following:
jasontavarez.com
On IE it looks the way its supposed to, but on Firefox (at
least on my computer) the tables used for the navigation bar seem
to have spread to its max values. I have checked the code and have
made it WC3 compliant, but I can't find the cause. I'm not even
using libraries anymore as I try to figure out the problem but to
no avail. Any help would be appreciated!
Happy new year!

In your code for the naviagtion table you have
cellspacing="#009933"
????...... That's enough probably to make a browser go nuts.
Change it to cellspacing="0"
Offending piece of code:
<td height="20" class="bg_navbar_main">
<table width="200" height="20" border="0" align="right"
cellpadding="0" cellspacing="#009933" class="menu">
jjbbooyy wrote:
> Hello all:
>
> I have been staring at my monitor for the last 8 hours
working on this and I
> can't figure it out. Long story short, I'm in the middle
of creating a simple
> website and what started as a simple desire to use a
Dreamweaver library for my
> navigation bar has become a full blown mission of being
browser compatible.
> Please take a look at the following:
>
>
http://www.jasontavarez.com
>
> On IE it looks the way its supposed to, but on Firefox
(at least on my
> computer) the tables used for the navigation bar seem to
have spread to its max
> values. I have checked the code and have made it WC3
compliant, but I can't
> find the cause. I'm not even using libraries anymore as
I try to figure out the
> problem but to no avail. Any help would be appreciated!
>
> Happy new year!
>

Similar Messages

Firefox crashes with css transform rotate

Firefox 25 crashes when using a CSS transform. Just try this in jsfiddle with Firefox 25. I think it worked in previous versions:
HTML:
<pre><nowiki><a href="/feedback/new?locale=es" class="sug_tab" data-target="#modalcontainer" data-toggle="modal">Ask me</a></nowiki></pre>
CSS:
<pre><nowiki>a.sug_tab{
font-family: "MS Sans Serif", Geneva, sans-serif;
letter-spacing: 1px;
position:fixed;
left:-45px;
top:25%;
background-color: #554455;
color:#fff;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
font-weight: bold;
font-size:16px;
padding-bottom:4px;
padding-top:4px;
padding-left: 6px;
padding-right: 6px;
z-index: 8888;
}</nowiki></pre>

I fixed it just changing the font. But the issue is still there. As it's been said by Swarnava It seems it will be fixed in Firefox 26.

Firefox not displaying CSS on webpages

I have seen this problem on multiple systems running recent versions of Firefox (26, 27, etc.) on Windows 7. All of a sudden, Firefox will not render the CSS formatting on most websites, basically leaving an unusable page. The only thing that seems to fix the problem is restarting the computer. There doesn't seem to be any rhyme or reason to when it happens. I've seen it happen after the system has only been up for a few minutes and also on systems that have been running for months.

Can you attach a screenshot?
*http://en.wikipedia.org/wiki/Screenshot
*https://support.mozilla.org/kb/how-do-i-create-screenshot-my-problem
Use a compressed image type like PNG or JPG to save the screenshot.
See:
*http://kb.mozillazine.org/Websites_look_wrong
Start Firefox in <u>[[Safe Mode|Safe Mode]]</u> to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem (switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance).
*Do NOT click the Reset button on the Safe Mode start window.
*https://support.mozilla.org/kb/Safe+Mode
*https://support.mozilla.org/kb/Troubleshooting+extensions+and+themes
Make sure that you haven't enabled a High Contrast theme in the Windows/Mac Accessibility settings.
Make sure that you allow pages to choose their own colors.
*Tools > Options > Content : Fonts & Colors > Colors : [X] "Allow pages to choose their own colors, instead of my selections above"
Note that these settings affect background images.
See also:
*http://kb.mozillazine.org/Website_colors_are_wrong

Need some help with Firefox and userChrome.css

As you can see there is some space underneath the tabs. I used the addon 'Classic theme restorer' to hide the adressbar, but unfortnanly it left some space underneath the tabs. I've been trying to fix it with userChrome.css myself, but I really dont know what am I'm doing.
Does anyone know how to remove it?

*For Safari (4.0.2)* I just clicked help>installed_plug-ins and get this:
http://www.easy-share.com/1908259228/Installed Plug-ins.html
*Firefox (3.5.3)* tools>add-ons>extensions: Ad Block plus
and tools>add-ons>Plug-ins: http://yfrog.com/6qnag2j
Message was edited by: Jonnymont
If I just delete these won't it make things worse? like not being able to go to any flash sites at all (majority of internet these days)
Message was edited by: Jonnymont

IE7-Firefox viewing differences

http://www.circl.pitt.edu/newsletter/2008-1/more_safar_center.html
In IE there are spaces around the images which I put in under
V space and H space in Dreamweaver 8.
Those spaces do not show in Firefox.
Does anyone know how to add spaces in with firefox, or do I
have to do it in html?

Start by running through and fixing these errors -
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.reptilesandamphibians.org%2F
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"46587phd" <[email protected]> wrote in
message
news:fupi9r$lcc$[email protected]..
> Could someone take a look at this site in progress in
both IE7 and
> Firefox? The
> Firefox version is exactly what shows in DW CS3. There
are so many huge
> differences, I don't know if there is a common thread
(i.e. a quick fix)
> or if
> there are many different issues, possibly requiring a
rebuild of the main
> template? Thanks! Paul
>
> www.reptilesandamphibians.org
>

Customizing Firefox w/ userchrome.css

Does anyone know how to remove the website icon from Firefox tabs using your userchrome.css?

.tab-icon-image {
display: none !important;
Last edited by droog (2009-09-12 01:52:36)

Overlapping Buttons in Firefox - Using HTML/CSS - Works in IE6

I have html that is being ingnored. Here is the snippet:
<pre><nowiki><%}else{%>
<DIV> <div style="float:right> <DIV CLASS="smallbuttons">
<TABLE WIDTH=100% BORDER=0 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD>
<input type="image" src="Images/Save.gif" style="cursor: hand" alt="Save data">
<img src="Images/Cancel.gif" style="cursor: hand" alt="Reset form values" onClick="javascript:reset()">
</TD>
<TD align="RIGHT">
<input type="button" name="E-Mail Notification" value="E-Mail" onClick="javascript:popemail();">
<input type="button" name="Help" value="Help" onClick="javascript:help();">
<img src="Images/Reviewnotes.gif" style="cursor: hand" alt="Create or read review notes for this component" border="0" onClick="javascript:reviewnotes();">
<img src="Images/Comments.gif" style="cursor: hand" alt="Create or read comments for this component" border="0" onClick="javascript:comments();">
<img src="Images/Reports.gif" style="cursor: hand" alt="Go to report page" border="0" onClick="javascript:goto('ReportSelection.jsp?selectedyear=<%=request.getParameter("year") %>&selectedcountry=<%=request.getParameter("country") %>&selectedle=<%=request.getParameter("le")%>&selectedbu=<%=request.getParameter("bu")%>')">
<img src="Images/Home.gif" style="cursor: hand" alt="Go to ITRP home" border="0" onClick="javascript:home();">
<img src="Images/Divisions.gif" style="cursor: hand" alt="Go to business unit home" border="0" onClick="javascript:buhome();">
</TD>
</TR>
</TABLE>
</DIV> </DIV> </DIV>
<%}%>
</nowiki></pre>
It's using the css Below:
<pre><nowiki>TD {
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size : 12px;
color : 330033;
.number{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: right;
.smallbuttons
position: absolute;
top: 92px;
float:right;
left: 10px;
.regular{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
}</nowiki></pre>
But the buttons overlap the text. I'm trying to shift the buttons from email etc to the right. Any ideas would be appreciated. This issue causes the text that in IE a row lower to shift up and the buttons overlapp.

A good place to ask questions and advice about web development is at the mozillaZine Web Development/Standards Evangelism forum.<br />
The helpers at that forum are more knowledgeable about web development issues.<br />
You need to register at the mozillaZine forum site in order to post at that forum.<br />
See http://forums.mozillazine.org/viewforum.php?f=25<br />

Firefox doesn' see css files, other browsers do recognize css files. Please, help me.

I'm creating the web-site. it is currently on the development level. the link is http://snazhmudinov.byethost7.com/
If you open it with chrome, safari and ie, it works fine. But when I start using Mozilla and Opera, they simply don't see css files.
Thank you in advance!

hello, your source code specifies the path to the stylesheet files like this styles\page.css instead of styles'''/'''page.css. apparently some browsers are less tolerant to such errors than others...

Firefox Light, removed CSS, displaying condensed text or missing entirely. - Noy Hadar

My previous version of FF was running up a crazy amounts of CPU resources, 700K+. So I found this light version. After installing it, there are all sort of issues.
1) Most of my emails like Yahoo and Gmail are displaying this "fine-print like" condensed text that I am unfamiliar with, even though Options > Content > Default Font: Verdana 12px
2) Other pages which seem to be forums or control panels are missing blocks of texts, while surrounding text are visible.
3) Some sites like GoDaddy are ENTIRELY stripped of all CSS styling. Things appear just plain text outline. From the menu; View > Page Style > Basic Page Style is set.
I'm just sure why these issues are happening selectively.
I'm running Window 7 x64. Help please! :)

hello, sorry but we cannot help with third-party products - you could try askin gin their support channels at http://sourceforge.net/p/lightfirefox/discussion/geneal/

Firefox displays the CSS "outline:;" on the outside of "-moz-box-shadow:;".

When using "outline" and "-moz-box-shadow" together, the outline is drawn on the outside or around the box shadow.
---Example:----------------
<pre><nowiki>
.box {
outline:1px solid rgb(0,0,0);
-moz-box-shadow:0 1px 5px rgb(90,90,90);
}</nowiki></pre>
Will this be fixed soon?

Since this seems to have some search engine ranking. This is https://bugzilla.mozilla.org/show_bug.cgi?id=480888 open as of this comment.
Please be considerate of developers time, don't comment on the bug unless you are offering to help fix it.

Separate CSS for IE and Firefox

Hi all,
older versions of Robohelp generated to separate CSS files in the Wephelp for IE and Firefox. Evidently this feature was dropped somewhen. However I need it now to resolve some specific Firefox problems in a project.
I thought I could add the corrsponding script in the master page that checks for the browser and selects the CSS, but thought I should ask the forum first.. are any solutions for this already known?
Robert

If you are sure there is no way around OK but sometimes someone knows a solution. I'm not saying I do, just that sometimes someone will pop their head over the parapet with the answer.
It used to be the case that bullets were a pain for me until I found out that Firefox's own CSS had an indent that you could negate without affecting IE. Result, almost the same appearance in both browsers.
I haven't tried it but RoboHelp 10 allows you to write media queries and you can define the browswer. In theory you can have a default style for IE and other browsers but specify a rule that if the browser is Mozilla, the CSS is to be modified.
That's the cheery theory and I don't know the ins and outs of how well it would work in reality. Do let us know if you decide to take the plunge.
See www.grainge.org for RoboHelp and Authoring tips
@petergrainge

Firefox 9 doesn't handle the css font stack properly

The style body{font:13px/1.231 arial,helvetica,sans-serif;*font-size:small;*font:x-small} should cause the browser to work through the stack and use sans-serif if arial and helvetica are not available. This is how it worked in Firefox 8 and how it works in other browsers.
With Firefox 9 if the first font is unavailable it just substitues one of it's own instead.
If I remove arial and helvetica from the list then FF9 uses the system sans-serif as it should.
I would paste in some sample code, but this forum doesn't seem to support code snippets.

The css in the blogpost http://krakrjak.blogspot.com/2012/01/firefox-901-font-css-bug.html is wrong, and that is why this does not work in Firefox. To access a class you must use the class selector (a dot). For example: .p-inner p { }<br>
You can go to Mozilla Developer Network to learn CSS.<br>
https://developer.mozilla.org/en-US/learn/css<br>

Firefox CSS problem

For some reason Firefox does not display my web page
correctly and IE7 does.
The problem is that the page border (given the id of
'wrapper') does not enclose the page's divs (indicated by white
box), as seen on
http://users.bigpond.net.au/csteed/mercury/new%20index.htm
- in Firefox.
The CSS is available at
http://users.bigpond.net.au/csteed/mercury/layout.css

csteed wrote:
> For some reason Firefox does not display my web page
correctly and IE7 does.
>
> The problem is that the page border (given the id of
'wrapper') does not
> enclose the page's divs (indicated by white box), as
seen on
>
http://users.bigpond.net.au/csteed/mercury/new%20index.htm
- in Firefox.
>
> The CSS is available at
http://users.bigpond.net.au/csteed/mercury/layout.css
>
You appear to be missing the closing </div> tag for
your 'wrapper <div>.
Try adding it just before the closing </body> (see
below) and also add
the <br style-"clear: both;"> as shown.
<p>Copyright 'The Mercury Centre'
2007</p></div>
</div>
<br style="clear: both;">
</div>
</body>

Firefox ignores CSS and renders sites poorly

Remember what websites looked like in 1995? No formatting, no background - just black text and blue hyperlinks.
well, this is what I see now in Firefox. :( No CSS - no graphics - just text and links on white b/g.

Clear Cookies & Cache
* https://support.mozilla.com/en-US/kb/Template:clearCookiesCache
Clear the Network Cache
* https://support.mozilla.com/en-US/kb/How%20to%20clear%20the%20cache#w_clear-the-cache
Troubleshooting extensions and themes
* https://support.mozilla.com/en-US/kb/Troubleshooting%20extensions%20and%20themes
Check and tell if its working

How do you save css rules created in web inspector?

Being a web developer, I usually use Firebug on Firefox to test CSS when I'm developing a website. Ever since I got my new iMac, I've really grown to love Safari. I like the Web Inspector but I cannot seem to find a way to copy any of the CSS rules I create for testing. Is there an effective way to create CSS rules and copy the whole CSS rule (property + declarations) so I can paste them somewhere else?

You can import and replace any styles you want from other documents, but templates are templates. That is what they are for.
Styles are document specific for a reason. Imagine the fun and games if the styles in one document changed the behavior of same name style in other unopened documents. You would be chasing your tail forever.
Someone would send you a file and it would inexplicably change layout and appearance just because your styles didn't match.
Peter

Firefox / IE differences! (CSS?)

Similar Messages

Maybe you are looking for