|
HTML - My Css Relative Positioning Doesn't Work In Firefox? Can Anyone Tell Me What To Do?
Never mind you guys were wrong as usual. Thanks.
Similar Tutorialsfor my sciece project i was making a webpage, and all my links were relative, i was wondering, why it doesn't work on the stupid piece of **** known as a mac!!!!!!?!?!!?!?!!?! Hi all, Before I pour cold water onto Mozilla's FireFox to melt it's flames and kill it, I've a question : Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Tables 14</title> </head> <body> <table border="1" width="80%"> <colgroup span="3" align="right" /> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> </table> </body> </html> As you can see, there's 3 columns and I'm using <colgroup span..../> to mass-align the cells to the right. However, when I preview it in FireFox, there's no effect. In Internet Explorer, the cells are right-aligned(which is correct). I also tried doing the CSS equivalent, but FireFox still fails. When I tried changing some other settings, like : <colgroup span="3" style="background-color:red;" />, FireFox renders the code correctly. Seems that FireFox doesn't like to right-align text in columns, eh? Thanks! Xeon. Hey guys! I've just realized my first site html5 and all it was ok about indeed the on-line publishing on my server. Indeed every test made on the local disk were good without Firefox does not read the audio and video files. It works with Google Chrome and Safari but not Firefox. I am anxious to specify that I'm under Mac Os X and that I converted well files in format OGG and that I am rather a graphic designer who try write some code. I try to find the solution for several days but unsuccessfully. Can anybody help me please? Here is the fragment of the code: HTML Code: <!-- Track 01 --> <div> <h3>Fall</h3> <div class="mp_options"> <span class="mp_play">Play</span> <span class="mp_addpl">Add to playlist</span> </div> <div class="mp_song_info" style="display:none;"> <span class="mp_song_title">Fall</span> <span class="mp_mp3">music/album1/Red_Fish_Fall.mp3</span> <span class="mp_ogg">music/album1/Red_Fish_Fall.ogg</span> </div> </div> <!-- Track 02 --> Hi, I have to display the results in 20 columns, in that 14 columns are frozen, rest of them are scrollable, when I give table widht in % then scrollbar presents to view the data in Firefox. If I see the same in IE, it doesnt show all the data, and there is no scrollbar. If I give the table width in px form then to some extent I am able to see the scrollbar in IE, and minimum pixel I had to give is 3000 and above. Is there any common solution to me to fix this so that I can see same both the browsers. We would like to have solution, width in % not in px. Please let me know the solution for this. I have attached the zip file for your reference to see the code, please run in IE and Firefox and check it. Advanced thanks, Venkat When I expand menu items IE automatically detects if scrollbars are needed. When I expand them in Firefox and the menus push below the bottom of the page no scrollbars show up. This might be a scripting issue as opposed to HTML - not sure. Hi all, Help on this would clear up this headache. I am using relative position to put this flash component flush with the right side of the layout. However, in different screen resolutions it still moves. Why is this? for ref: www.burnthisforyourfriends.com Here's the code: <html> <head> <title>Burn This for Your Friends, show dates, music, media, downloads and store</title> </head> <body bgcolor="#000000"> <center><img src="http://img704.imageshack.us/img704/3791/burnthisheader.jpg" /> <br /><a href="http://www.burnthisforyourfriends.com/index.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="Home" border="0" /></a><a href="http://www.burnthisforyourfriends.com/releases.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="releases" border="0" /></a><a href="http://www.burnthisforyourfriends.com/artists.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="artists" border="0" /></a><a href="http://www.burnthisforyourfriends.com/studio.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="studio" border="0" /></a><a href="http://www.burnthisforyourfriends.com/gallery.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="gallery" border="0" /></a><a href="http://www.burnthisforyourfriends.com/bookinginfo.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="bookinginfo" border="0" /></a><a href="http://www.burnthisforyourfriends.com/press.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="press" border="0" /></a><a href="http://www.burnthisforyourfriends.com/store.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="store" border="0" /></a><a href="http://www.burnthisforyourfriends.com/contactus.html"><img src="http://img704.imageshack.us/img704/686/mainnavigationplacehold.jpg" alt="contactus" border="0" /></a> <br /><img src="http://img514.imageshack.us/img514/9773/flashplaceholderred.png" /><img src="http://img163.imageshack.us/img163/8006/flashplaceholdergreen.png" /><img src="http://img340.imageshack.us/img340/4820/flashplaceholderyellow.png" /> </center> <div style="position: relative; top: 20px; left: 659px;"> <p> <script type="text/javascript" src="js/swfobject.js"></script> <script type="text/javascript"><!-- Ok so im making a webpage for my CSC class for school. And i have been designing the webpage on my macbook under the desktop folder called "CSCWebpage". I uploaded the folder into my ftp and i opened up one of the pages in firefox and the relative links are not working. such as img, a, my image map image, and also my css file i cant connect to. I know this is a noob question, so im sorry for the ignorance! im new. lol. Hi, I need help I tried to check the code of my website it works perfectly well in google chrome and firefox but not in Internet explorer. i tried your suggestions but still it doesn't work. After the "marital status" and "sex" are selected, I want to assign a default value to the "Title" field. I think I am calling the function DefaultTitle incorrectly because I am not even seeing the initial alert box. Any suggestions? function DefaultTitle(strng,x) { alert("Checking Title."); var Sex=documet.PatientEntry.personal_sex.value; var MaritalStatus=strng; if (Sex=="Female" && MaritalStatus=="Married") {document.PatientEntry.personal_Title.value="Mrs."; HighlightWhite(x); Return; } if (Sex=="Male") {docment.PatientEntry.personal_Title.value="Mr."; HighlightWhite(x); Return; } if (Sex=="Female" && MaritalStatus=="Single") {document.PatientEntry.personal_Title.value="Miss"; HighlightWhite(x); Return; } if (Sex=="Female") {document.PatientEntry.personal_Title.value="Ms."; HighlightWhite(x); Return; } } Sex: <SELECT name="personal_sex" id="personal_sex" tabindex=7> <OPTION>Male</OPTION> <OPTION>Female</OPTION> </SELECT> Marital status: <SELECT name="personal_MaritalStatus" id="personal_MaritalStatus" onmouseout="DefaultTitle(this.value,this.id)" tabindex=8> <OPTION>Married</OPTION> <OPTION>Single</OPTION> <OPTION>Separated</OPTION> <OPTION>Divorced</OPTION> <OPTION>Widow(er)</OPTION> </SELECT> Title: <SELECT name=personal_Title tabindex=9> <OPTION>Mr.</OPTION> <OPTION>Mrs.</OPTION> <OPTION>Ms.</OPTION> <OPTION>Miss</OPTION> <OPTION>Dr.</OPTION> </SELECT><BR> Hey all, I just heard from a visitor of my page http://www.randypauschsubtitles.de that the page doesn't work in IE and does only display the top frame with the title of the page. As a Firefox user, this problem is new to me. Unfortunately, I created the page with Dreamweaver/Frontpage and don't know much about HTML etc. What can I change to make my page work in IE too? Thanks for your help! Okay, I received some pictures from a fashion designer to use for her Web site. I first tested the code by using a different image that I found on Google and it worked. However, when I used her image it was broken. The next option I tried was I used my photobucket account and make an HTML reference to the image. Even when I upload it to photobucket it gives me an error. So...I don't know if it's still my problem or possibly she gave me the wrong product. The images were .jpg. Here's the image code I tried: <img src="/pictures/ct1.jpg"/> If it's not the code, then what can I do to make sure she gives me pictures that work? I'm completely baffled. I have a contact form on this website: http://www.waldronforest.com/ that works just fine when I test it in FireFox, but when I try to use it in internet explorer I can't even click on the fields. Anyone have any idea why? Thanks! I have this code in my website: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>PinkuHaruKoneko</title> </head> <body text="#ffffff"> <font face="arial"> <style> <!-- A{height:1px;behavior:url(linkhilight.htc);filter:progid:dximagetransform.microsoft.gradientwipe duration=1)} A:link { text-decoration: none; color:#ffffff;} A:visited { text-decoration: none; color:#ffffff; } A:hover { text-decoration:line-through; cursor: crosshair; color:#ffffff;} body { scrollbar-arrow-color: #CEE0F6; scrollbar-darkshadow-color: #090E3C; scrollbar-track-color:#090E3C; scrollbar-face-color: #275674; scrollbar-shadow-color:#CEE0F6; scrollbar-highlight-color:#CEE0F6; scrollbar-3dlight-color: #090E3C; text-align:justify} h1 { border: 1px solid #000000; background-color:#0000ff; font-size:14px; text-align:center; } --> </style> With that code, text align justify -elements doesn't work and h1 doesn't work at IE. If I take away that thing before <html>, it works but in IE bg isn't transparent anymore. Is there anything what I can replace that doctype-thing and get that code work in Mozilla and IE? I made two style sheets for my project. First one is style.css, and the scond one is ie6.css which is intentionally left blank. This latter (ie6.css) is, ofcourse, made specialy for IE6 and in HTML head section I put
Code: <!--[if lt IE 7.0]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->
I can't realise what's wrong, since when I preview site in IE6 it acts like conditional statement is not there. It should display page with no style, but still the page is displayed with style.css styling. You can check it out on: http://www.byethost.com/ for page is very simple. Thank's in advance! Okay I have tested the following code in all browsers and IE is the only one that it doesn't work for for .html pages. It does work for .asp pages though. I do not want to use iframes. Any suggestions? <object type="text/html" height="100%" width="100%" data="http://www.websitename.com"> </object> EDIT: I fixed it all! I just had unnecessary table indications. duuuhhhh. Hopefully my fix will help someone else with the same problem, though? Hi everyone! I am new here, so please bear with me! I found a few posts about this, but none seemed to fix my problem. First off, my website is he http://www.ashleywilliamsflute.com My problem is that the banner on top is set to be at 65% width. This works great in firefox and safari, but the image won't resize in IE. So, I tried using a css tag, too, and that didn't work. Here's the code I have: Code: <!DOCTYPE html>
<html>
<head>
<title>Ashley Williams: Flutist</title>
<body bgcolor="#000000">
<style type="text/css">
A:link {background: #000000; font-weight: bold; text-decoration: none; color: #c4eaef; letter-spacing: 3px;}
A:visited {background: #000000; font-weight: bold; text-decoration: none; color: #c4eaef; letter-spacing: 3px;}
A:active {background: #c4eaef; font-weight: bold; text-decoration: none; color: #000000; letter-spacing: 3px;}
A:hover {background: #c4eaef; font-weight: bold; text-decoration: none; color: #000000; letter-spacing: 3px;}
h2 {font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; color: #c4eaef; }
p {font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; color: #f1ebf1; size: 11pt; letter-spacing: 2px; line-height: 20pt; strong: 15pt; text-align: justify; margin-left: 25%; margin-right: 25%; text-indent: 30px; }
#banner {
float:center;
width:65%;
}
</style>
</head>
<body>
<div align="center" width=65%>
<table border="0" width=65%>
<tr>
<img id="banner" src="topbanner.jpg" width=65%>
</tr>
</div>
<tr>
<h2>
<div align=center width=65% style="background-color: "#000000">
| <a href="index.html"> HOME </a> |
<a href="resume.html"> RESUME </a> |
<a href="teaching.html"> TEACHING </a> |
<a href="replist.html"> REPERTOIRE LIST </a> |
<a href="programs.html"> PROGRAMS </a> |
<a href="art.html"> ART </a> |
<a href="contact.html"> CONTACT </a> |
<a href="links.html"> LINKS </a> |
</div>
</h2>
</tr>
<P>
IE also doesn't use my text settings, like the margins I chose. I'm not sure how to fix this. I used to make websites a lot, but haven't in a few years, not since CSS was just starting to be popular, and I feel quite lost! I hope someone will be able to help me-you all seem very knowledgeable and helpful so I will cross my fingers. Thanks a lot, everyone! -Ashley Hi, I'm not very advanced or anything, but I've coded websites before from scratch using Text Edit and an FTP client. I haven't done it for a few years and recently made a website with Cyber duck as the FTP client and SubEthaEdit as the external editor. I made a simple code for frames, and the site looks terrific on my Mac's Safari and Internet Explorer. When I checked it out on my friend's PC, it's just one big color background and nothing else. It also doesn't work on Mac's Firefox. I don't know what I did wrong, and how to fix the code to make it work on PCs or Firefox. Do PCs not recognize code that Macs do? Is there a way to change it? It's probably my fault, I just don't know what it's missing. I'd appreciate any help anyone has to offer, because I'm clueless and disappointed about it. Thanks, Jenny Hi guyz, I have created my first site for a school project. The site has been validated, does work properly on IE but it doen't work well in FF. Please have a look and try to find out the errors. Thanks, the html code is: HTML Code: <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head><link rel= "stylesheet" type="text/css" href="external.css" /> <title>Business Environment Study Support</title> </head> <body> <div id="header"> <h1><img src="logo3.jpg" alt="" /></h1> </div> <div id="mainmain"> <div id="navcontainer"> <ul id="navlist"> <li><a href="lessonone.html">lesson one</a></li> <li><a href="#">Topic name I</a></li> <li><a href="#">Topic name II</a></li> <li><a href="#">Topic name II</a></li> <li><a href="#">Topic name IV</a></li> <li><a href="#">Topic name IV</a></li> </ul> </div> <!--main navigation menu elements--> <div id="bannerbox"> <p><a href="http://www.independent.co.uk/" target="_blank"><img src="independent.jpg" alt="The Independent Magazine"/></a></p> <p><a href="http://http://www.bton.ac.uk/" target="_blank"><img src="brighton-logo.jpg" alt="University of Brighton"/></a></p> <p><a href="http://www.theguardian.co.uk/" target="_blank"><img src="guardian-logo.jpg" alt="The Guardian"/></a></p> <p><a href="https://studentcentral.brighton.ac.uk/" target="_blank"><img src="studentlogo.jpg" alt="Blackboard"/></a></p> </div> <!-- right side banners--> <div id="mainbody"> <h3>Lore Ipsum</h3> <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.</p> <p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.</p><p>lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.</p> <br /> <p><a href="index.html" target="_top">-top-</a></p> </div> <!-- main body elements--> </div> <div id="footr"> <div id="footer"> <ul id="navilist"> <li><a href="mailto:o.szotyori@brighton.ac.uk?cc=dn36@brighton.ac.uk">contact Us</a></li> <li><a href="#">about the project</a></li> <li>made by: Dumiso and Oliver</li> <li>December, 2009</li> </ul> </div> <div id="w3valid"> <p> <a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10-blue" alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a> </p> <!-- shows current validation of the homepage--> </div> </div> <!-- the footer is separated from the main body so it can be manipulated separety--> </body> </html> and the CSS code is: Code: body {background-color: #CCCCCC;}
/* this sets up the background of the page */
h3 { font-family: verdana; color: #FF6600; }
p { font-family: verdana; color: #000000; font-size: 12px;}
/* these set up the font families of the header and paragraph behavors */
a {text-decoration:none; font-family: verdana;}
a:link {color: #FF6600}
a:visited {color: #993300}
a:hover {color: #FF6600; font-weight: bold;}
a img {border: 0;}
/* these set up the font families of the links behavors */
#header{
width: 800px;
height: 200px;
text-align: center;
margin: auto;
padding-bottom: 5px;
}
#mainmain{
background-color: #ffffff;
text-align: center;
width: 1024px;
margin: auto;
border-bottom: 2px solid #FF6600;
}
#navcontainer ul
{
text-align: center;
margin: auto;
background-color: #FF6600;
color: White;
float: left;
width: 1024px;
font-size: 11px;
}
#navcontainer ul li { display: inline; }
#navcontainer ul li a
{
padding: 0.2em 1.5em;
background-color: #FF6600;
color: #CCCCCC;
font-weight: bold;
text-decoration: none;
float: left;
border-right: 1px solid #fff;
}
#navcontainer ul li a:hover
{
background-color: #993300;
color: #CCCCCC;
font-weight: bold;
}
#bannerbox{
float: right;
margin-top: 60px;
min-height: 700px;
min-width: 180px;
text-align: center;
}
#mainbody{
float: left;
padding: 20px;
width: 804px;
min-height: 700px;
margin-top: 20px;
background-color: white;
}
#footer{
position: relative;
float: left;
height: 20px;
overflow: hidden;
width: 500px;
}
#navilist{
list-style-type: none;
margin: 0;
padding: 0;
}
#navilist li{
border-left: 1px solid #000;
float: left;
line-height: 1.1em;
margin: 0 .5em 0 -.5em;
padding: 0 .5em 0 .5em;
font-size: small;
color: #FF6600;
}
#w3valid{
float: right;
position: relative;
width: 88px;
height: 31px;
}
#footr{
text-align:center;
width: 1024px;
margin: auto;
padding-top:10px;
}
I made a custom 404 error page and edited my .htaccess file with this Code: ErrorDocument 404 /error.html I've followed many different tutorials for this and nothing seemed to work. It still shows the default apache 404 page. Any suggestions? -Hartless The code like: bgcolor="rgb(255,255,0)" is working well in IE but not in Opera. Is it exsist a method to create a color multibrowserly? I am writing an application that creates html page with Javascript game and I can't write color like usualy "#FD3800" |
|||||||