|
HTML - Firefox Issues
Hello,
My website works fine in IE but when i open it in Firefox the small square images don't show up - can anyone give advice on what is causing this and a fix for it? http://www.turbulenceurbanwear.com/leilani.htm Thanks for your help Similar TutorialsHello, Having issuse with the browsers. Firefox I am all good but when I look at IE7 one page stops reading my CSS. I have NO idea y. PLEASE HELP!!! Using the following code column within my datagrid. It gives me different results within firefox and IE. It should show some text and then the image should appear after the text. Within IE 7 it works fine but within firefox 3.6.10 the image is directly over the text. I'm not using a CSS file. This is a page I inherited and I'm asked to fix this. Any help would be appreciated. Code: <asp:templatecolumn headertext="Name" headerstyle-width="90px" sortexpression="varName">
<itemtemplate>
<asp:label width="10" id="lblName" runat="server">
<%# DataBinder.Eval(Container.DataItem,"varName")%>
</asp:label>
<img src='/Images/Info16x16.gif' border=0 />
</itemtemplate>
</asp:templatecolumn>
Hi guys, I've been working on a website for a friend for a while now and thought I had it complete. That was until I opened it with IE! Things don't look right in IE - and also IE crashes when some pages are loaded. Any chance you could look at this page: http://www.flatvision.name/de/index.php in both IE & Firefox and offer some advice as to why it does what it does? Thanks very much - help and advice much appreciated. ! Leigh I know that means I have some errors in my code, but Im having trouble spotting them. The background isnt working right in Firefox and Opera. Link: http://killinghookers.net (Code has been changed slightly. View the source on the page for the latest code) For some reason as well, the copyright information isnt staying at the bottom of the page but is floating left of the main content under the right nav column. After messing around this is what I have: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Title" content="RSGOD.NET HOME" />
<meta name="author" content="I Hate My User Name">
<title>RSGOD.NET HOME</title>
<link href="master.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="page">
<div id="logo"></div>
<div id="nav">
<ul>
<li><a href="/" title="Home">Home</a></li>
<li><a href="http://www.killinghookers.net/forum" title="Visit The Forum">Forum</a></li>
<li><a href="#" title="#">Nav Item</a></li>
<li><a href="#" title="#">Nav Item</a></li>
<li><a href="#" title="#">Nav Item</a></li>
<li><a href="#" title="#">Nav Item</a></li>
</ul>
</div>
<div id="side_left">
<div id="side_cat_title">
Navigation
</div>
<font color="#000099"><p>Home</p></font><br />
<p><b>Other Important Sections:</b></p>
<p> · <a href="http://www.killinghookers.net/forum" title="forum">Forum </a></p>
</div>
<div id="center">
<div id="cat_title">
News
</div>
Here's some news :)
</div>
<div id="side_right">
<div id="side_cat_title">
Useful Links
</div>
<p>· <a href="http://www.killinghookers.net/forum/index.php?act=Reg&CODE=00" title="Register to Enjoy the Benifits of Killing Hookers!"> Register </a></p>
<p>· <a href="http://www.killinghookers.net/forum/index.php?act=UserCP&CODE=00" title="Visit Your Profile"> My Controls </a></p>
<p>· <a href="http://www.killinghookers.net/forum" title="Visit the Forum"> Forum </a></p>
<p>· <a href="http://www.killinghookers.net/forum/index.php?showforum=36" title="Need a Game? Visit the Games Section!"> Game Downloads </a></p>
<p>· <a href="http://www.killinghookers.net/forum/index.php?showforum=39" title="Visit for the Best Movies!"> Movies </a></p>
<p>· <a href="http://www.killinghookers.net/forum/index.php?autocom=market" title="Market"> Store </a></p>
<p>· <a href="http://www.killinghookers.net/forum/index.php?autocom=sotw" title="Sig Of the Week"> Sig of the Week </a></p>
<p>· <a href="http://www.killinghookers.net/forum/index.php?showforum=7" title="Visit for Awesome Music!"> Music Downloads </a></p>
</div>
<div id="footer">
<p>
©2007 Killing Hookers.net
<br />
Coding Help (Lots!) by <a href="http://bbmodding.com/about.php" title="I Hate My User Name's Website">I Hate My User Name</a> <- Super Tech :)
</p>
</div>
</div>
</div>
</body>
</html>
Code: /*
+---------------------------------------------------------------+
| |
| CSS and HTML Designed by I Hate My User Name |
| Contact: ihatemyusername [at] hotmail.com |
| Do not reuse without my permission! |
| |
+---------------------------------------------------------------+
*/
body {
margin: 0px;
padding: 0px;
height: 100%;
/*Have to reset those terrible browser defaults*/
background-color: black;
width: 940px;
margin-left: auto;
margin-right: auto;
}
#wrapper {
width: 940px;
height: 100%;
margin-left: auto;
margin-right: auto;
/*Creates our fixed width and the margins center it*/
background-image: url("images/wrapper.png");
/*Borders*/
}
#page {
width: 922px;
height: 100%;
margin-left: auto;
margin-right: auto;
/*This has the actual page centered between the borders*/
background-color: black;
font-family: verdana;
font-size: 12px;
color: white;
}
#logo {
width: 922px;
height: 200px;
background: url("images/logo.png");
}
#nav {
width: 922px;
height: 28px;
background: url("images/nav_bg.png");
border-top: 1px solid #808080;
border-bottom: 1px solid #808080;
font-family: verdana;
font-size: 12px;
color: black;
background-color: white;
}
#nav ul {
margin: 0px;
list-style: none;
display: block;
float: left;
padding-left: 0px;
margin-left: 0px;
}
#nav li {
margin: 0px;
list-style: none;
display: block;
float: left;
width: 99px;
height: 22px;
padding-top: 6px;
padding-left: 0px;
margin-left: 0px;
border-right: 1px solid #808080;
text-align: center;
}
#nav a {
color: #333333;
text-decoration: none;
}
#nav a:hover {
color: black;
text-decoration: underline;
}
#side_left {
float: left;
width: 150px;
height: auto;
margin-top: 10px;
margin-left: 5.5px;
margin-right: 5.5px;
background-color: white;
color: black;
}
#center {
float: left;
width: 596px;
height: auto;
margin-top: 10px;
background-color: white;
color: black;
}
#side_right {
float: left;
width: 150px;
height: auto;
margin-top: 10px;
margin-left: 5.5px;
margin-right: 5.5px;
background-color: white;
color: black;
}
#cat_title {
width: 591px;
height: 19px;
background: url("images/cat_title.png");
font-size: 12px;
padding-top: 5px;
padding-left: 5px;
border-bottom: 1px solid #808080;
}
#side_cat_title {
width: 150px;
height: 19px;
background: url("images/side_cat_title.png");
font-size: 12px;
padding-top: 5px;
border-bottom: 1px solid #808080;
text-align: center;
}
#footer {
width: 940px;
height: 28px;
margin-left: auto;
margin-right: auto;
/*Creates our fixed width and the margins center it*/
background-image: url("images/footer_bg.png");
}
#footer p {
text-align: center;
font-family: verdana;
font-size: 10px;
color: white;
/*Borders*/
vertical-align: bottom;
height: 28px;
}
Help much appreciated. I was making the template for my friend and didnt realize the Firefox bug. Hi Everyone- I'm hoping someone out there might be able to solve a problem I've been having with my site for a number of years. The site was designed for IE but with the growing popularity of Firefox and Safari (to name a few), I want to insure that it works properly with those browsers. For the most part, it does -- except when displaying a background image in a table. For example - look at this page: http://www.cygnus-x1.net/links/rush/...anentwaves.php When viewed in I.E., the grey background image with the woman displays properly, as does the full image of the album cover within. However when viewed in Firefox or Safari, the background image repeats near the bottom for about 20 pixels. The problem also exists on a page like this one: http://www.cygnus-x1.net/links/rush/lyrics.php Where the brown background image which includes the words "Rush Lyrics" displays properly in I.E. but seems to repeat for 20 pixels in FF. This one's been driving me crazy for years and, due to some recent changes I've been making, it's come back to haunt me. If anyone has any suggestions as to why this is happening and what I can do to remedy it, I would greatly appreciate it... Thanks so much. Hi, I'm just learning html and I'm creating my website in Frontpage 2003. I looked in IE6 and my individual pages are exactly how I want them to look. However, viewing the same pages in Firefox presents me with a problem I'm not sure how to correct. It has to do with the center table. I originally copied and pasted the contents from Excel into the table (which I think was a mistake now). My workaround to this was copying and pasting the contents in the table into Notepad; and also shortening the length of each line; and then re-pasting the contents back into the table. It looks o.k. in Firefox but the alignment is no longer "justified". Can someone please tell me what I should be doing in the html code here? To see what I mean please open the link below in both IE and Firefox. http://www.prosperityteachers.com/ne...ew_thought.htm Much appreciated! Hey all, I was wondering if anybody had any pointers on this website I've been building. It looks alright so far in Firefox, but I've had some issues in IE. The link is: http://www.totaros.com/totaros new/index.html Specifically, -The image distortion on the menubar-what are the best types of images to save these as for compatibility in IE? -The menubar not resizing in IE with different resolutions -Aligning text next to pictures (such as on the Entertainment page). This works in FF, but not in IE. -Any other problems noticed. Thank you! Hi - I got a small issue with onmouseover and clickable area on images in Firefox. Things work fine in IE but don't work correctly in Firefox. With firefox there seems to be dead areas where there shouldn't be dead and detects mouseovers were it shouldn't. Same goes goes for clickable area of the button image. Go here and click on the one button - http://www.agile-x.com/bridgeway/ then try the buttons at the bottom of the window that pops up in Firefox and IE. Thanks. Hello, I am pretty new to the whole html world so forgive me if this is a simple problem. I have look all over for a post explaing this problem but i haven't found anything. I am making a site for a friend using Dreamweaver. I know i know, i regret not coding it from scratch but its too late now. Anyways I have a pretty good page layout going now but I have ran into a problem with loading my images. On my home page an image in a table nested inside another table will load when viewing in safari but seems to disappear in firefox. What is going on? Its a pretty simple piece of code. I place; <img src="Pictures/RDV couplepalm.jpg" width="200" height="" style="float:right; padding: 8px; margin-left:10px; margin-bottom: 10px" / inside of a paragraph in a row of a table. I have rewritten the code for this image, copied it from a working image and screwed around with the table heights (although I wasn't too sure what i was doing). What else should I try? I have attached screen shots of the site in both browsers a copy of the problem jpeg aswell as a copy of the html. Any information anyone could givee me would be REALLY appreciated! Thank you. Hello! I'm having quite a problem implementing multiple backgrounds into my website. Simply put I want to have a top bar, that will function as header, and a bottom bar, that will function as a footer. I've tried the following solution but it just doesn't seem to work. The div id "bgBottomDiv" just won't show. I was hoping someone could help me out. HTML: HTML Code: <body> <div id="wrapper"> <div id="bgBottomDiv"> "Content goes here " </div> </div> CSS: Code: #wrapper{
position:relative;
margin:0 auto;
width:1100px;
}
body {
background-image:url(/images/Styler_top.png);
background-attachment: scroll;
background-repeat: repeat-x;
background-position: top;
font-family: arial;
color: #111111;
font-size: 0.75em; /* 12px/16=0.75 em */
word-spacing: 2px;
line-height: 175%;
}
#bgBottomDiv{
background-image: url(images/Styler_top.png);
background-repeat: repeat-x;
background-position: bottom;
}
Thanks in advance! Alright, so I have this site on which I need a certain part of the site (the content part where the main text bit is) to extend down to the bottom (and preferably no longer), so that if the window is smaller or bigger the text will still just go all the way down to the bottom of the page, and when the text is further down that div will have a scrollbar so you can scroll through the text. The main issue is making it so the end of the div is always on the bottom of the page. (I've tried height=100% on that div but then it just goes below the bottom for some reason.) This is the site. And here's the code: Code: CSS:
div.main { position: absolute;
top: 181px;
left: 110px;
width: 510px;
height: 1500px;
background: url("images/Content Box Bit.png"); }
div.news { position: absolute;
top: 25px;
left: 15px;
width: 494px;
height: 372px;
overflow-x: hidden;
overflow-y: auto; }
Code: HTML:
<div class="main">
<img src="images/News and Updates.png"><div class="news">
<span class="f4"><?php include('sitemapbase.php'); ?></span></div>
</div>
The reason the height of main=1500px is that that's not gonna be scrollable anyway, and I just added a random value to assure that went to the bottom no matter what. Thanks for any help. Wasn't really sure where to put this, sorry if it's the wrong place.. EDIT: Just encountered an additional issue, being that the navigation menus (to the left) look off in IE. The background seems not to start where the div starts. Suggestions? I have a page I created in dream weaver. It displays fine in IE7, but in IE6 it does not. Here is a link to the page: Problem Page If anyone has any ideas, I'd really appreciate it. Right then... Problem is, uploaded website, thought that it was ok, checked in Firefox, Safari and even icab... did not check IE (rookie) and did IE have problems? Of course. Basically Some of pics are not showing up - mainly in the shop and one or two on the main pages. I cannot work out how to fix, def not broken links, really boring I know, but can anyone help? Link to site: http://www.thefrenchpantry.co.uk much appreciated... I'm experiencing an issue when using DIVs in DIVs.. I have a container-DIV and a content-DIV, and I would like the container-DIV to stretch vertically as necessary based on how much content is in the content-DIV. Code: <html>
<header>
<style type="text/css">
#divContainer{
position:absolute;
top:10px;
left:10px;
height:100%;
width:200px;
background-color:#CCC;
}
#divContent{
position:absolute;
top:10px;
left:10px
width:180px;
background:color:#BBB;
}
</style>
</header>
<body>
<div id="divContainer">
<div id="divContent">
<!-- Fill me with content -->
</div>
</div>
</body>
</html>
This is basically the code I'm using... whenever the content amount pushes the divContent lower than the bottom of the divContainer, it just overflows out and down the page. What am I doing wrong? Edit: OOPS I set height to 100px on the divContainer, it was supposed to be 100% http://www.farewell-travel.com/newsl...rch2012_2.html Why does this look like crap in Internet Explorer? (Specifically talking about the "Highlights" box) It looks fine in firefox but not on IE. I've tried everything to fix it, I don't know what to do! The width dimensions for some reason are way off. It bloats up to 272px when it should be 200px! Please help! Thanks -Please note this is an e-mail newsletter, that is the reason I'm using tables! Arg... IE is bugging me as usual.... Now I've been working on the fantasy football site the past few days getting ready for the fantasy season... but when I look at the site on IE we have a few issues going on... here they a 1. text rendering on the image switcher... why does the text look bold? The info there is using the default font-size of 13px which I set... I'm assuming that probably has something to do with it. 2. The poll part 1 Why on earth is the question indented 6px? The links in the "newest articles" section are set to indent 6px... but I set that on the list... the question of the poll isn't even in a list and it somehow got indented... 3. More crappy text rendering on the poll answers... now I'm seeing the results because I voted and the text looks absolutely horrendous... no idea why either. Any help with these IE crazy things would be greatly appreciated... thanks! I have a simple HTML page that I would like to have 2 checkboxes available for the user to click. Now where this gets a little different: I do not want to have this "form" to function as a normal form, as this webpage is generated and displayed from within a desktop application (as a template). I essentially just want the user to click a checkbox and then click the print button from within the desktop application and have the webpage print with the checkbox checked. I am running into a problem because the checkbox that the user checked clears out when the user clicks the print button. I am assuming this is because I do not have any sort of "submit" method being used for this form (as it is just essentially a display for the user to check off an option that should then be printed as displayed on the screen). Is this at all possible? I am restricted to using HTML, CSS and XSL to build these web templates that are displayed in the desktop application so asp, javascript etc is not an option. Thanks for any help. I have a photography website that is set up for purchasing prints. I had one of you wonderful people help me out with a form problem some time ago. I needed information to be inserted into the form based on the particular page (or photo) that the person was on. It needed to insert the photo name in the form that came up when you clicked the purchase link. All was working great until a few weeks ago. Now, when you click the link, it inserts the name, but the form thinks the field is blank. Since its a required field, the user still has to type it. Is there a easy fix for this? Here is the site: http://www.sthompsonphoto.com/galler...p?showimage=59 I cant figure it out! Any help would be great! Thanks! ok hiya im wondering if you can sort my problem out? i recently set up a forum for a gaming clan and i have thought of a design that i like but there is a problem.... i have designed a background which can be seen he http://img177.imageshack.us/img177/3...imgcopylm8.jpg btw the middle isnt orange only for thsi sample i made. the only problem is it works perfectly for the resolution of my screen (1280x800) but not on my pc which is 1024x768. because of this it throws the whole of the forum out of line on a different resolution screen. the code for this background is in the css stylesheet but i was wondering if there was a code i could use that would display a different picture depending on the screen resolution i.e. i could rado the image several times to fit each screen resolution. if not gthen is there anyway of haveing a background with those 2 bits on the sides that will work in all of the resolutions?? his is how i want my site to look and how the sides should be and this is how it shows at 1280x800: this is perfect until you view it at any other resolution.lol like this resolution(1024x768): is there anyway of making it look like the top on all of the resoltuions? the link to the site i want to use it on is: www.gusoldiers.forumn.net here is the cxode im currently using (for this part): * { margin: 0px; padding: 0px; } html { background-color: #000001; font-size: 100%; height: 100%; } #min-width { min-width: 750px; } body { background-color: #cce3f3; background: url('http://img177.imageshack.us/img177/339/backgroundimgcopylm8.jpg') repeat-x; background-attachment: fixed; font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif; font-size: 62.5%; /* This sets the default font size to be equivalent to 10px */ margin: 0px 0px 0px 0px; padding: 0px; border-color: #862121; border-width: 0px 0px 0px 0px; border-style: solid; } { font-size: 10px; height: auto; padding: 10px 0px; scrollbar-face-color: #; scrollbar-highlight-color: #; scrollbar-shadow-color: #; scrollbar-3dlight-color: #; scrollbar-arrow-color: #; scrollbar-track-color: #; scrollbar-darkshadow-color: #; } * html .conteneur_minwidth_IE { /* Hack IE min-width */ padding-left: 750px; } * html .conteneur_container_IE { /* Hack IE min-width */ margin-left: -750px; position: relative; } * html .conteneur_minwidth_IE, * html .conteneur_container_IE, * html .conteneur_layout_IE { /* Hack IE min-width */ height: 1px; } #wrap { width: 80%; margin: 0px auto; background-color: #1a1a1a; background-image: url(""); background-repeat: repeat-x; background-attachment: fixed; border-color: #46494b; border-width: 0px 0px 0px 0px; border-style: solid; padding: 5px; } #wrapnav { width: 800%; margin: 0; background-color: #ECECEC; border-width: 1px; border-style: solid; border-color: #A9B8C2; |
|||||||