|
HTML - Having Problems With Code In Mozilla/safari
I've been doing some html newsletters for a company for a while. I use simple html with tables and this template that the other graphic designer put together. The focus of teh email is made up of spliced images, assembled in a table and then each image is linked to the appropriate website location.
The problem I have, is in mozilla and in safari (two of the three browsers I test on) make the <tr> part of the table split? It separates the <tr> cells and causes white lines between the images. This only happens after the email has been sent out, not when I test it in a browser before submitting it to the email newsletter server. I'm trying to figure out ways around it or to fix up the html. Anyone who is willing to help me, I will send you the newsletter so you can see what I am talking about as well as post the code up in this thread. Thank you, -Allie Similar TutorialsNvm im an idiot there is my code. any reason why it looks good in chrome/safari but it looks bad in mozilla? in mozilla it has a bunch of lines going through it and the images are all seperated. any help would be much appreciated. Thanks, George Code: <!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">
<head>
<title>share</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
body {
background-color: #ffffff;
background-image: url(../background-for-website.png);
background-repeat: repeat-x;
}
#apDiv1 {
z-index:1;
}
</style>
</head>
<body>
<!-- Save for Web Slices (share.psd) -->
<center>
<table id="Table_01" width="792" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="5">
<img id="share_01" src="images4/share_01.png" width="791" height="155" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="155" alt="" /></td>
</tr>
<tr>
<td colspan="5">
<img id="share_02" src="images4/share_02.png" width="791" height="137" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="137" alt="" /></td>
</tr>
<tr>
<td colspan="5">
<img id="share_03" src="images4/share_03.png" width="791" height="142" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="142" alt="" /></td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img id="share_04" src="images4/share_04.png" width="544" height="70" alt="" /></td>
<td> <div class="apDiv" id="apDiv"><a href="http://www.facebook.com/sharer.php?u=https://www.facebook.com/pages/itunes-cards-for-free/200510223345141" target="_blank">
<img id="share_05" src="images4/share_05.png" width="137" height="21" alt="" />
</a></div> </td>
<td rowspan="4">
<img id="share_06" src="images4/share_06.png" width="110" height="257" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="21" alt="" /></td>
</tr>
<tr>
<td rowspan="3">
<img id="share_07" src="images4/share_07.png" width="137" height="236" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="49" alt="" /></td>
</tr>
<tr>
<td rowspan="2">
<img id="share_08" src="images4/share_08.png" width="319" height="187" alt="" /></td>
<td><a href="../page 5/redeem.html"><img src="images4/button.png" onmouseover="this.src='images4/button-3.png'" onmouseout="this.src='images4/button.png'"/></a>
</td>
<td rowspan="2">
<img id="share_10" src="images4/share_10.png" width="75" height="187" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="30" alt="" /></td>
</tr>
<tr>
<td>
<img id="share_11" src="images4/share_11.png" width="150" height="157" alt="" /></td>
<td>
<img src="images4/spacer.gif" width="1" height="157" alt="" /></td>
</tr>
</table>
</center>
<!-- End Save for Web Slices -->
</body>
</html>
Hi, I need some help please? I have bought/made a simple html page on internet. The problem is that when i uploaded it to my ftp server which is on www.one.com and tried it in IE it did not work as it should. It works perfectly in any other webbrowser like Safari, Mozilla, GoogleChrome, Opera. Why not IE? Is there anybody out there who can help me? Somebody please tell me what's wrong? Best regards Pete index.html HTML Code: <!DOCTYPE html>
<html lang="en">
<head>
<title>RUSSEUKEN.no</title>
<meta charset="utf-8">
<meta name="description" content="Russeuken">
<meta name="keywords" content="russ, russefeiring, bergen, uken, russeuken, norge, 17. mai, fest ">
<meta name="author" content="Russeuken">
<[if IE]><link href="css/ie_style.css" rel="stylesheet" type="text/css" /><[endif]>
<[if lt IE 9]><script type="text/javascript" src="js/html5.js"></script><[endif]>
<[if lt IE 7]><script type="text/javascript" src="http://info.template-help.com/files/ie6_warning/ie6_script_other.js"></script><[endif]>
<link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="css/grid.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">
<link href="css/jbgallery-2.0.css" id="jbgallery-css" rel="stylesheet" media="javascript-screen" />
<!-- styles for prettyPhoto -->
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="all">
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/Myriad_Pro_400.font.js"></script>
<script type="text/javascript" src="js/Myriad_Pro_900.font.js"></script>
<script type="text/javascript" src="js/Myriad_Pro_400r.font.js"></script>
<script type="text/javascript" src="js/cufon-replace.js"></script>
<script src="js/jbgallery-2.0jbgallery-2.0.js" type="text/javascript"></script>
<script type="text/javascript"><!--
jQuery(document).ready(function(){
jQuery(".jbgallery").jbgallery({
menu : "numbers",
style: "zoom",
slideshow : true,
caption : false
});
});
--></script>
</head>
<iframe id="ytplayer" type="text/html" width="0" height="0" hidden="1" src="http://www.youtube.com/embed/BpJhT4yzWyo?autoplay=1" frameborder="0"/></iframe>
<body>
<div class="extra"></div>
<div class="extra1">
<div id="main">
<!-- header -->
<header class="head">
<div class="jbgallery">
<ul>
<li><a href="images/1.jpg"> </a></li>
<li><a href="images/4.jpg"> </a></li>
<li><a href="images/2.jpg"> </a></li>
<li><a href="images/3.jpg"> </a></li>
<!--<li><a href="images/5.jpg"> </a></li>-->
</ul>
</div>
<div class="block-2">
<div class="logo"><a href="http://www.exodus.no"><img src="images/logo.png" alt=""></a></div>
<nav>
<ul class="sf-menu">
<li><a href="russeuken.html">RUSSEUKEN</a></li>
<li><a href="arrangement.html">PROGRAM2012</a></li>
<li><a href="russ.html">RUSS</a></li>
<li><a href="bilder.html">BILDER</a></li>
<li class="last"><a href="kontakt.html">KONTAKT OSS</a></li>
</ul>
</nav>
</div>
<div class="text-1">change bg</div>
</header>
</div>
<!-- footer -->
<footer>
<div class="container">
<div class="indent">
<div class="wrapper">
<div class="fright">
<span>RUSSEUKEN.no</span> © 2012
</div>
<div class="fleft"><!-- {%FOOTER_LINK} --></div>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
ie_style.css Code: .link-1,.link-2,.block-1,.block-2,.sf-menu a:hover,.sf-menu a.current,.sf-menu a,.content-box,.main-banner,.sf-menu li ul,#advanced{behavior:url(js/PIE.htc); z-index:100;}
.link-1,.link-2,.block-1,.block-2,.content-box,.main-banner,.content-box,.content-box-1{behavior:url(js/PIE.htc); z-index:100; position:relative}
ie7.css Code: /* IE7 specific styles */
#constuction-box {display:inline;}
#intro-box {display:inline;}
.tabs code { overflow:visible !important;}
#contact-form { height:580px;}
.block-1{behavior:url(js/PIE.htc); z-index:100; position:relative}
html5.js PHP Code: // Create new HTML5 elements =================================================== // ----------------------------------------------------------------------------- // This script should load before any others. We want the new elements to be // parsed before pretty much anything happens. // Plus, IE does not behave otherwise. The cost of being progressive... // ----------------------------------------------------------------------------- document.createElement("article"); document.createElement("aside"); document.createElement("audio"); document.createElement("canvas"); document.createElement("command"); document.createElement("datalist"); document.createElement("details"); document.createElement("embed"); document.createElement("figcaption"); document.createElement("figure"); document.createElement("footer"); document.createElement("header"); document.createElement("hgroup"); document.createElement("keygen"); document.createElement("mark"); document.createElement("meter"); document.createElement("nav"); document.createElement("output"); document.createElement("progress"); document.createElement("rp"); document.createElement("rt"); document.createElement("ruby"); document.createElement("section"); document.createElement("source"); document.createElement("summary"); document.createElement("time"); document.createElement("video"); I am having display problems in Safari (3.1.1). All other browsers installed in my computer show the site correctly: Opera 9.21 Chrome 1.0.154.43 IE 7.0.5730.11 Here is the page: http://www.shootthehead.com/safari.htm Any help is appreciated. This is so frustrating! I have a set of image links on the home page of my website, just like this: <a href="t-store.aspx"><img border="0" alt="Online Store" src="site/include/cssstore.gif"></a> For some reason, they don't work at all on Safari (on a Mac, no idea about Windows Safari). I don't really see what could possibly be causing that. There doesn't seem to be anything in the CSS that could cause this either, the div is just: text-align: center; float: right; width:200px; Worst comes to worst, I could make them into text (which might have been the right thing to do from the beginning), but now I just want to figure this out! Any ideas? EDIT: Text links didn't work either, but other links on the page do. Is there something that would make links not work in one div on a page? I was looking for the correct place to put this thread, and there is not a Vbulletin area that I can find. Hopefully someone will let me know a better place to place this information because I have a couple of other problems as well. BB Code, is a way to replace HTML for security reasons. In the BB code you use in replacement of certain variables in the code a parameter input that looks like this: {param} So here is my problem and I hope someone with knowledge of vB will understand. Code: <style="text-alaign:right:"><a href="http://www.place4musicians.com/Music/free_music/{param1}/{param2}" target="_blank"><img src="http://www.place4musicians.com/music/images/custom_images/free_download.png"></a>
1) the align right does not work! 2) I've tripple checked the location and the spelling but I can't get the download link to work! The image works fine, but there is something that is keeping the code from allowing a download of the RAR image. Any help in this would be appreciated. Link to page on forum username: test password: test1234 You will also see a second issue on the link, but I don't want to ask about that just yet. Many thanks if help may be provided here! Code: <table border="0" cellpadding="0" cellspacing="0" id="NavigationBar1"> <tr> <td align="left" valign="top" width="117" height="31"><a href="www.conflict-gamers.net/forums"><img id="bv01002" src="bv01002.gif" alt="" align="top" border="0" width="117" height="31" onmouseover="SwapImage(1,0,'bv01002','bv01002_over.gif')" onmouseout="SwapImage(0,0,'bv01002','bv01002.gif')"></a></td> </tr> </table> and this is the image i want in there. http://img84.imageshack.us/img84/406...onforumfl2.jpg Can anyone help please. I have a website that i created. It loads in in Mozilla, but in IE nothing loads, the page is just blank. my website, an example of this is www.winholdem.info/hoppers.php I dont know why this is happening! P.S. it includes PHP and html hi just a small problem that is bugging me and stopping me from moving on...there is a table at the top of my website here in mozilla it works fine exactly how i want it yet in internet explorer it stretches out too far and looks a mess what could i do about it? is this because ie doesnt accept height tags? my tables are not right in mozilla/firefox. it looks perfect in ie. 42% of my viewers are ie users. 37% are mozilla compatible agents, and 8% are firefox. i just downloaded firefox from mozilla and found that none of my tables look white, with the exception of the front page: http://leilanimunter.com/index2.html on all the other pages, the table where the text is should be white like it is on that home page, but instead it is my grey background color. how do i fix that? HELP, thanks!!! Leilani http://leilanimunter.com How can I get my favicons to show up in Mozilla/Firefox? Thanks~ this is my page http://web.vtc.edu/users/cjb06271/CI...nal/order.html there are several things I would like to happen. 1. the right collumn background to be where the right collumn should be(so other links in navbar) 2.The test between the roach pictures to be alligned with the top rather than bottom of pictures (so smaller windows can see) 3. When you size the window smaller than the text, a scroll bar appears, and when you scroll the background no longer exists. If I put it on auto the background will only go as far as the text does. 4. (nice but not required)The cocroachs to be alligned to the left and right of the top bar respectively, and the text in the middle. 5. (nice but not required) the right column background image is being cut in half (as does the top one if you size small enough). any way to make the images ignore the collumns? don't worry about the colors I will be changing them soon Hi all, I wanted to learn HTML before 1 year, but I gave up, it was too much too read But now I wanna start again, and I'm searching for the tool I used. But I can't find it, it was so easy, and I was able to use it, and believe me, there's not much I CAN use It was a simple editor tool, and I think it was from Mozilla. That's what it did: I wrote something in HTML, and when I pressed preview he showed me what will display when I add the code on a website. And I was able to save my codes as a file format, but I don't know which, I think something standard... And now I want that tool again, but I searched for 2 hours now and I can't find it... Does ANYONE know the name? I would be very pleased about a helpful answer... Or does anyone know a tool which does, what I described? A simple tool? ______________________________ CuddlyBunny AkA Nico hi i have a bit of a problem i am making a website with html and css and when i want to view it in mozilla i only get the text and when i open it in ie6 i see my whole stylesheet i dont get it html Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Visual Basic Tutorials</title>
<link rel="stylesheet" "type=text/css" href="style.css" />
</head>
<body>
<div class="spacer"></div>
<div id="wrapper">
<div class="banner">
<img src="dat.png" /> </div>
<div class="tekst" id="links">
<div>Main content </div>
<hr />
<div class="textboxes">
<div class="textboxspacertitle">
<h3>Title</h3>
</div>
<hr />
<div class="textboxspacertext">
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
</div>
</div>
<div class="textboxes">
<div class="textboxspacertitle">
<h3>Title</h3>
</div>
<hr />
<div class="textboxspacertext">
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
<p>TekstTekstTekstTekstTekstTekstTekstTekstTekstTekstTekst</p>
</div>
</div>
</div>
<div class="menu" id="rechts">
<div class="menuspacer">
<h3>Navigation</h3>
</div>
<hr />
<div class="menuspacer">
<div class="list">
<ol>
<li><a href="Index.html">Home</a></li>
<li><a href="Tutorials.html">Tutorials</a></li>
<li><a href="Downloads.html">Downloads</a></li>
<li><a href="Links.html">Links</a></li>
<li><a href="Contact.html">Contact</a></li>
</ol>
</div>
</div>
</div>
</div>
<div class="spacerbottom">
Copyrights by: Kevin 2008 </div>
</body>
</html>
css: Code: *{
margin: 0;
padding: 0;
}
body{
font-family: arial;
color: #333;
size: 12px;
background: #ddd;
}
.spacer{
height: 1.8em;
display: block;
}
#wrapper{
background: #eee;
width: 800px;
height: 900px;
margin-bottom: 20px;
margin: 0 auto;
border: 1px solid #999;
}
.banner{
background: #bbb;
border:2px solid #999;
height: 98px;
width: 717px;
margin-left: 40px;
margin-top: 50px;
vertical-align: middle;
}
.tekst{
border: 2px solid #999;
height: 700px;
width: 500px;
background: #bbb;
min-height: 700px !important;
}
.menu{
border: 2px solid #999;
width: 200px;
background: #bbb;
}
#links{
float: left;
margin-left: 20px;
margin-top: 25px;
}
#rechts{
float: right;
margin-right: 20px;
margin-top: 25px;
}
a:hover{
text-decoration: underline;
}
a{
text-decoration: none;
color: #000;
}
.menuspacer{
margin: 15px 15px 15px 15px;
}
.textboxes{
border: 2px solid #999;
margin-left: 25px;
margin-right: 25px;
margin-top: 15px;
height: 200px;
background-color: #ddd
}
.textboxspacertitle{
margin-left:10px;
margin-top: 15px;
}
.textboxspacertext{
margin-left:10px;
margin-top: 5px;
margin-bottom: 10px;
}
.spacerbottom{
height: 1.8em;
display: block;
text-align:center;
}
img{
border: 1px solid #999
}
Hey, I've downloaded a template to use for my webpage and i changed up the width of the middle section (in grey) within the css, it views perfectly in mozilla, but when viewed in IE it's as if i didn't widen the width of the middle section at all and as a result the text and images i have put in the area are compacted. Does anyone have any ideas of how i can get IE to view my site the same as mozilla is? Mozilla is displaying the site as i want it too look. The text is more spread out wthin the grey area. http://www.revolutionct.com.au/boot_camp_canberra.html Appreciate any help! Thanks. I used code below to play mp3. Explorer can not play mp3 but mozilla can. What is problem? < A HREF = "MYMP3.MP3".....> OR, <EMBED SRC= "MYMP3.MP3" ...> Hi, I am trying to build my daughter's website on geocities and for the videos section I am trying to use page jumps DIVs. I am using mozilla and everytime I go on it the page jumps and the DIVs is all mess up and I don't know what's wrong with it then I tried going on internet explore and my codes worked on there but just not on mozilla. Does anybody know what I can do or change? I am currently using the basic html DIVs and page jumps. I have a following html document <html xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <body title="Integrated MedFacts Module"> <span class="normalFont" style="font-size:140%; width:100%; "><b>Tetracycline Capsules and Tablets</b></span><b>Pronunciation: </b>tet-ra-SYE-kleen<br><b>Brand Name: </b> Sumycin<br><br><b>This medicine is used for:</b><p>Treating infections caused by certain bacteria.</p> </body> </html> The above document when seen in IE 7 shows Tetracycline Capsules and Tablets and Pronunciation in separate lines. But the same documetn when seen in Mozilla FireFox or Opera is showing Tetracycline Capsules and Tablets and Pronunciation in same lines without any space between them. Can anyone let me know why this is hapenning? Thanks, Ragha For some reason, using <table align="center" width="85%"> at the following http://amazingfreegraphics.com/webfetti.html correctly shows the content in 85% of the browser in Internet Explorer, but still covers 100% in Mozilla. How do I fix in Mozilla? |
|||||||