Firefox Compatibility Options

[jordanriane]

Do you normally use Firefox as your browser, but want to make sure that your overrides work for IE as well?

Well, it is possible to make it work between Firefox and IE.

Most of the overrides you'll need to change will be related to pixels, tables, percentages, etc.

To create this compatibility, you will need to work out of ie (and firefox).
Create your overrides so that they work in ie, but not firefox.

Now that you have your overrides compatible with ie, we'll work with making them compatible with firefox.

Find the snippets of coding that are not working properly with firefox.
Copy the coding, and paste it directly under it, so you have stated twice. However, with the second one, you will be adding !important before the semi-colon (;).

Like so:

CODE

table { width: 254px;
         width: 256px!important;
}

IE does not recognize the !important so it will use the first specifications. Firefox (and most other browsers) will recognize the small code and use that specification since it's listed as "!important."


However, take into consideration that sometimes coding changes with resolutions, which will have an impact on your journal. It may not be perfect for everyone, but at least you now have cross-browser compatibility with your overrides.

[*Libertie*]

Great idea, I never thought to post anything like this. I'm sure many people will find this helpful.

[espressive]

Oohhh! I get it now! Thanks sooo much!!!!

[b0st0ngrl]

That's really helpful. Thanks :)

[pawprints2570]

wow. i never knew that! that really helps a LOT with my layouts since i use firefox. thanks.

[Eryi]

Find the snippets of coding that are not working properly with firefox.
Copy the coding, and paste it directly under it, so you have stated twice. However, with the second one, you will be adding !important after the semi-colon (;).

Like so:

CODE

table { width: 254px;
         width: 256px!important;
}

I don't understand that part, I'm trying to use this.

[add1cted2f1re]

you said AFTER the ; but you put the code before it, which do i do?

[jordanriane]

it's before, but it works either way, at least it has for me.

[add1cted2f1re]

<!-- begin code provided by createblog.com --><br /><!-- LAYOUT BY: RequestAll --><br /><style>body, a:hover{cursor: url(http://www.freewebs.com/pyr0tech21/kirby.ani);}</style><br /><br /><!-- LAYOUT BY: RequestAll --><br /><img src="http://i27.photobucket.com/albums/c181/requestlayouts90/Kirby/kribybanner3.jpg" width="800" height="400" border="0" alt="" usemap="#kirby_Map"><br /><map name="kirby_Map"><br /><area shape="rect" alt="Creator" coords="635,363,798,400" href="http://www.xanga.com/RequestAll" target="_blank"><br /><area shape="rect" alt="Creator" coords="659,37,799,72" href="http://www.xanga.com/RequestAll" target="_blank"><br /><area shape="rect" alt="Sign In" coords="741,0,799,38" href="http://www.xanga.com/signin.aspx"><br /><br /><br /><!-- vv INPUT YOUR XANGA USER NAME HERE vv --><br /><br /><area shape="rect" alt="Subscribe!" coords="644,0,724,39" href="http://www.xanga.com/private/SubscribeTo.aspx?user=XANGA USER NAME" target="_blank"><br /><br /><!-- ^^ INPUT YOUR XANGA USER NAME HERE ^^ --><br /><br /><area shape="rect" alt="Your Blog" coords="458,0,520,39" href="http://www.xanga.com/private/home.aspx"><br /><area shape="rect" alt="Edit" coords="538,0,627,39" href="http://edit.xanga.com/claf.aspx"><br /><area shape="rect" alt="Xanga" coords="384,0,440,39" href="http://www.xanga.com"><br /></map><br /><br /><br /><style type="text/css"><br />table.navigation, table.footer { display:none; }<br /></style><style type="text/css"><br />.#rblEprops{display:none;}<br />#pnlEnabled table, #htmleditor, #lblTimeZone,<br />/* width of the comment page */<br />{width:245px;}<br />.leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer <br />{display: none;} <br /></style><br /><br /><style type="text/css"><br />body <br />{background-color: #6699ff;<br />background-image:url(http://i27.photobucket.com/albums/c181/requestlayouts90/Kirby/background2.jpg);<br />background-attachment: fixed;<br />background-position: center center;<br />background-repeat: no-repeat;<br />scrollbar-arrow-color: #a7ecda;<br />scrollbar-track-color: #a7ecda;<br />scrollbar-shadow-color: #ccffff;<br />scrollbar-face-color: #ccffff;<br />scrollbar-highlight-color: #ccffff;<br />scrollbar-darkshadow-color: #ccffff;<br />scrollbar-3dlight-color: #ccffff;}<br /><br />div.blogheader, .caption <br />{background-image: url(http://i27.photobucket.com/albums/c181/requestlayouts90/Kirby/kirby.gif);<br />background-repeat:no-repeat;<br />background-position: right center;<br />font-family: Kristen ITC;<br />text-transform:none;<br />font-weight: bold;<br />font-size:15px;<br />line-height:19px;<br />font-weight:normal;<br />color:#6699ff;<br />letter-spacing:0px;<br />text-align:center;<br />border:0px solid #ff99ff;}<br /><br />.blogbody b, .standard b, p b, strong {<br />font-weight: bold;<br />color: #3333cc;}<br /><br />input, select, textarea, iframe.htmleditor, .textfield, .button {<br />border: 1px solid #0033ff;<br />alignment: center;<br />font:normal 15px Kristen ITC;<br />background-color: #99ccff;<br />font-color:#0033ff;}<br /><br /> table.footer TD {<br />text-align: center;}<br /><br />font,td,p,xmp<br />{color:#3333cc;<br />font-family:Kristen ITC;<br />font-weight:normal;<br />font-size:11pt;<br />text-align:justify;}<br /><br />table.blogbody tr td {  <br />width:0px; <br />padding-left: 0px;} <br /><br />table.blogbody {<br />background-color:transparent;<br />font-family:Kristen ITC;<br />BORDER: #0099cc 1px solid;<br />font-size: 13px;<br />width:345px;<br />width:345px!important;} <br /><br />a:link<br />{line-height: 12pt; <br />font-family: Kristen ITC;<br />font-weight:bold; <br />color:#ff00ff; <br />text-transform:none;<br />font-size:10pt; <br />cursor:hand;}<br /><br />a:active<br />font-family: Kristen ITC;<br />font-weight:bold; <br />color:#ff00ff; <br />text-transform:none;<br />font-size:10pt; <br />cursor:hand;}<br /><br />a:visited<br />{font-family: Kristen ITC; <br />color:#6666ff; <br />text-transform:none;<br />text-decoration: strikeout;<br />font-size:10pt;<br />cursor: hand;}<br /><br />A:hover {font-family:Kristen ITC;<br />color:#ff99ff;<br />text-transform: lowercase; <br />cursor: normal; <br />font-weight:normal;<br />font-size:10pt}</style><br /><br /><div style="overflow: auto;<br />width: 377px;<br />width: 377px!important;<br />height: 340px;<br />height: 340px!important;<br />margin-top: -349px;<br />margin-top: -349px!important;<br />margin-left: -420px;<br />margin-left: -420px!important;"><br /><!-- LAYOUT BY: RequestAll --><br /><!-- end code provided by createblog.com -->

i used that "!important" code, but like, it doesnt work on FF still

did i do it wrong?

[*Libertie*]

^ For the second one (the one with !important) change the value so it does work in FF.

[add1cted2f1re]

^ For the second one (the one with !important) change the value so it does work in FF.

OIC! lol, my bad

[asfhnnd]

I tried and I tried, I just can't seem to get it to work with firefox, a lil help?

<!-- begin code provided by createblog.com --><br /><!-- begin code provided by createblog.com --><br /><script language="Javascript" type="text/javascript"><br /><!--<br />document.title="A Day in the Life..."<br />//--></script><br /><style type="text/css"><br />body {<br />cursor: default;<br />background-color: #CCCCCC;<br />background-image: url();<br />background-repeat: repeat-y;<br />background-attachment: scroll;<br />background-position: center center;<br />scrollbar-face-color: #CCCCCC;<br />scrollbar-shadow-color: #CCCCCC;<br />scrollbar-highlight-color: #CCCCCC;<br />scrollbar-3dlight-color: #CCCCCC;<br />scrollbar-darkshadow-color: #CCCCCC;<br />scrollbar-track-color: #CCCCCC;<br />scrollbar-arrow-color: #000000;<br />}<br />#blogbody {<br />filter: chroma (color=#FFFFEB);<br />scrollbar-face-color: #FFFFEB;<br />scrollbar-shadow-color: #FFFFEB;<br />scrollbar-highlight-color: #FFFFEB;<br />scrollbar-3dlight-color: #FFFFEB;<br />scrollbar-darkshadow-color: #FFFFEB;<br />scrollbar-track-color: #FFFFEB;<br />scrollbar-arrow-color: #000000;<br />}<br />#menu {<br />filter: chroma (color=#BAEAFF);<br />scrollbar-face-color: #BAEAFF;<br />scrollbar-shadow-color: #BAEAFF;<br />scrollbar-highlight-color: #BAEAFF;<br />scrollbar-3dlight-color: #BAEAFF;<br />scrollbar-darkshadow-color: #BAEAFF;<br />scrollbar-track-color: #BAEAFF;<br />scrollbar-arrow-color: #000000;<br />}<br />div.blogheader, .caption {<br />font-family: comic sans ms;<br />text-align: left;<br />text-transform: none;<br />font-variant: none;<br />font-size: 14px;<br />line-height: 24px;<br />font-weight: bold;<br />color: #000000;<br />letter-spacing: 2px;<br />background-color: transparent;<br />background-image: url();<br />background-repeat: no-repeat;<br />background-position: center center;<br />filter: none;<br />border: none;<br />width: 295px;<br />}<br />.left, .blogbody, table.footer, .standard, .leftmodulefontcolor, .menuhead, .menumod, td, p {<br />font: normal 12px comic sans ms;<br />line-height: 16px;<br />letter-spacing: 0px;<br />color: #000000;<br />}<br />.blogbody b, .standard b, p b, strong {<br />font-weight: bold;<br />font-family: century gothic;<br />color: #66CCCC;<br />}<br />.blogbody i, .standard i, p i, em {<br />font-style: italic;<br />color: #CF9F70;<br />}<br />.blogbody u, .standard u, p u {<br />text-decoration: none;<br />color: #000000;<br />border-bottom: 3px ridge #786048;<br />}<br />input, select, textarea, iframe.htmleditor, .textfield, .button {<br />font: normal 11px comic sans ms;<br />color: #000000;<br />letter-spacing: 1px;<br />background-color: #c8c8c8;<br />border: 0px solid #000000;<br />}<br />table.blogbody tr td {<br />width: 0px; <br />padding-left: 0px;<br />} <br />table.blogbody {<br />font-family: comic sans ms;<br />background-color: transparent;<br />background-image: url();<br />filter: none;<br />border: none;<br />width: 295px;<br />}<br />a:link {<br />font-family: comic sans ms;<br />color: #0099CC;<br />text-decoration: none;<br />cursor: default;<br />}<br />a:visited {<br />font-family: comic sans ms;<br />color: #0099CC;<br />text-decoration: none;<br />cursor: default;<br />}<br />a:hover {<br />font-family: comic sans ms;<br />color: #000000;<br />text-decoration: none;<br />cursor: default;<br />}<br />hr {<br />color: #589FE7;<br />height: 3px;<br />}<br />.menumod {<br />font: normal 11px comic sans ms #000000;<br />line-height: 15px;<br />width: 105px;<br />background-color: #BAEAFF;<br />border: none;<br />padding: 0px;<br />text-align: left;<br />}<br />.menuhead {<br />font: bold 14px comic sans ms #000000;<br />line-height: 26px;<br />text-align: center;<br />background-color: #BAEAFF;<br />width: 105px;<br />}<br /></style><br /><style type="text/css"><br />.leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer, .search, .serachbarborder <br />{display: none;}<br />.#rblEprops{display:none;}<br />#pnlEnabled table, #htmleditor, #lblTimeZone,<br />/* width of the comment page */<br />{width:280px;}<br /></style><br /><map name="navigation" id="navigation"><br /><area alt="Xanga" shape="rect" coords="413, 307, 450, 324" href="http://www.xanga.com"><br /><area alt="Login" shape="rect" coords="414, 328, 445, 344" href="http://www.xanga.com/signin.aspx"><br /><area alt="Logout" shape="rect" coords="450, 328, 470, 344" href="http://www.xanga.com/logout.aspx"><br /><area alt="Profile" shape="rect" coords="414, 347, 453, 364" href="http://www.xanga.com/profile.aspx?user=YOURUSERNAME"><br /><area alt="Edit Profile" shape="rect" coords="456, 347, 479, 364" href="http://www.xanga.com/Private/profilebasic.aspx"><br /><area alt="Guestbook" shape="rect" coords="413, 368, 473, 384" href="http://www.xanga.com/guestbook.aspx?user=YOURUSERNAME"><br /><area alt="Subscribe to me!" shape="rect" coords="413, 388, 471, 404" href="http://www.xanga.com/private/subscribeto.aspx?user=YOURUSERNAME"><br /><area alt="Subscriptions" shape="rect" coords="413, 407, 464, 424" href="http://www.xanga.com/Private/subs.aspx"><br /><area alt="Private" shape="rect" coords="413, 427, 470, 444" href="http://www.xanga.com/private/home.aspx"><br /><area alt="Look and Feel" shape="rect" coords="413, 448, 456, 464" href="http://www.xanga.com/claf/default.asp"><br /></map><br /><div align="center" style="width: 740px;"><br /><img src="http://images.cbimg6.com/xanga/33/8145.jpg" border="0" usemap="#navigation"><br /></div><br /><div id="menu" style="height: 160px; width: 170px; overflow: scroll; margin-right: -273px; margin-top: -420px;"><br /><div class="menuhead">About Me</div><br /><div class="menumod"><br /><b>Name:</b> Anonymous<br><br /><b>State:</b> somewhere<br><br /><b>Birthday:</b> January 1, 2006<br><br /><b>Interests:</b> hmmm...<br /></div><br /><br><br /><div class="menuhead">Subscriptions</div><br /><div class="menumod"><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br><br /><a href="http://www.xanga.com/friend">Friend</a><br /></div><br /><br><br /><div class="menuhead">My Blogrings</div><br /><div class="menumod"><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br><br /><a href="http://www.xanga.com/blogring">Blogring</a><br /></div><br /><br><br /><div class="menuhead">Links</div><br /><div class="menumod"><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br><br /><a href="http://www.link.com">Link</a><br /></div><br /><br><br /><div class="menuhead">Other</div><br /><div class="menumod">Fill this space with whatever you'd like. :)<br /></div><br /><br><br /><div class="menuhead">Credits</div><br /><div class="menumod"><br /><b>Layout:</b> <a href="http://www.xanga.com/Mintyfresh977">Mintyfresh977</a><br><br><br /><b>Images:</b> <a href="http://www.evsc.k12.in.us/teachers/high/bosse/schaffer/notepad.gif">[·]</a> <a href="http://www.rockola.com/Snapple/SnappleCap_jpgs/snapple_outsidesmblu.jpg">[·]</a> <a href="http://www.nestlebarnmat.se/images/common/siteimages/postit/postItBlue.jpg">[·]</a> <a href="http://www.business-supply.com/product_images/image/EB041259_easy-writer-ball-pen-fine-point-blue-ink-clear-barrel.gif">[·]</a> <a href="http://www.safefundraising.com/images/ICS_SNICKERS_BAG_LR.jpg">[·]</a> <a href="http://images.apple.com/ipod/images/indexu2green20050627.gif">[·]</a> <a href="http://adweek.blogs.com/photos/uncategorized/penny.jpg">[·]</a> <a href="http://www.openblackboard.com/activities/money/images/quartertail.jpg">[·]</a> <a href="http://www.brent-krueger.com/images/2004%20Uncirc%20Nickel%20obverse-gs.jpg">[·]</a><br><br><br /><b>Graphics:</b> Adobe Photoshop Elements 3.0<br><br /></div><br /></div><br /><div id="blogbody" style="width: 341px; height: 350px; overflow: scroll; margin-top: -122px; margin-left: -258px; background-color: #FFFFEB;"><br /><!-- end code provided by createblog.com --><br /><!-- end code provided by createblog.com -->

[*Libertie*]

This is the Livejournal help forum, post in Xanga help to have this question answered.

[supertrouperjen]

Thanks so much!

[caseyfaceyx]

This is the code for the layout I'm using:

<!-- begin code provided by createblog.com --><br />GLOBAL_HEAD<=<br /><style><br /><style type="text/css"> <br /><!-- <br />} <br />table table { <br />border: 0;<br />} <br />table { <br />width: 49%; <br />margin-left: 48%; <br />margin-right: 0%; <br />border: 1px solid; <br />} <br />table table { <br />width: 100%; <br />margin:0; <br />} <br />table table table { <br />width: auto; <br />}<br />A:link { text-decoration: none; cursor: s-resize; color: #000000;}<br />A:visited { text-decoration: none; cursor: s-resize; color: #000000;}<br />A:hover { color:#996666; text-decoration: none; background-color: #FFFFFF; cursor: s-<br /><br />resize;}<br />body, td, font, div, p { <br />font-family: trebuchet ms; font-size: 11px;<br />}<br />body {<br />margin-top: 10px !important;<br />background-color: #FFFFFF !important;<br />background-image: url(http://images.cbimg5.com/livejournal/10/2321.jpg) !<br /><br />important;<br />background-position:bottom left;<br />background-repeat:no-repeat;<br />background-attachment:fixed;<br />}<br />body {scrollbar-face-color:#ffffff;<br />scrollbar-highlight-color:#000000;<br />scrollbar-3dlight-color:#000000;<br />scrollbar-shadow-color:#000000;<br />scrollbar-darkshadow-color:#000000;<br />scrollbar-arrow-color:#000000;<br />scrollbar-track-color: #000000;}<br />--> <br /></style> <br /><title>think of me fondly...</title><br /><meta content="text/html; charset=utf-8" http-equiv="Content-Type"><br /><meta content="revealTrans(transition=2, duration=4.0)" http-equiv="Page-Enter"><br /><meta content="progid:DXImageTransform.Microsoft.GradientWipe(Duration=4)" http-equiv="Page-Exit"><br /><=GLOBAL_HEAD<br /><br />LASTN_TALK_READLINK=><a href="%%urlread%%"> %%messagecount%% thought%%mc-plural-s%% </a>| <br /><br />FRIENDS_TALK_READLINK=><a href="%%urlread%%"> %%messagecount%% thought%%mc-plural-s%%<br /><br />DAY_TALK_LINKS<=<br /><tr> <br /><td align="right" colspan="2" width="150%" bgcolor="%%color:weak_back%%" class="comments"> <br />%%readlink%%<a href="%%urlpost%%">think of me</a> <br /></td> <br /></tr> <br /><=DAY_TALK_LINKS<br /><br />LASTN_TALK_LINKS<=<br /><tr> <br /><td align="right" colspan="2" width="150%" bgcolor="%%color:weak_back%%" class="comments"> <br />%%readlink%%<a href="%%urlpost%%">think of me</a> <br /></td> <br /></tr> <br /><=LASTN_TALK_LINKS<br /><br /><br /><!-- end code provided by createblog.com -->

I have firefox, and it's not working. . and I really don't get the important! things. I have a myspace, and I see that usually in the codes, but I don't get this.

Help, maybe?

Thanks in advance!