|
HTML - Iframes Javascript Links Will Not Work In Safari!!!
hey guys on my website i am going to play music and so that the music will continue to play and not restart while the viewers are browsing, i have made it so that u stay on the same page and the iframe will change when u click on the links
i am going to have the sidebar change for different pages so the sidebar is also an iframe. the links on the sidebar are actually javascript links so that they will adjust the height of the body iframe and change the src my website is HERE! this website works beautifully in internet explorer, but in safari the sidebar is useless can anyone tell me why? THIS IS THE CODE FOR THE IFRAMES HTML Code: <td class="sidebar"> <img src="http://ryanhollis.webs.com/icons/sidebar1.png" alt="" width="200" height="46"/><br class="pic"/> <iframe src="sidebar.html" height="200" width="150" class="sidebar" id="sidebar" scrolling="no" frameborder="0" allowtransparency="true"></iframe> <img src="http://ryanhollis.webs.com/icons/sidebar3.png" alt="" width="200" height="46"/> </td> <td class="text" rowspan="2"> <img src="http://ryanhollis.webs.com/icons/body1.png" alt="" width="642" height="64"/><br class="pic"/> <center><iframe src="home.html" height="300" class="body" id="iframe" scrolling="no" frameborder="0" allowtransparency="true"></iframe></center> <noframes> Your browser is out of date. To view this site you are going to have to update your browser. </noframes> <img src="http://ryanhollis.webs.com/icons/body3.png" alt="" width="642" height="70"/> THIS IS THE CODE FOR THE LINKS THAT ARE ON THE ACTUAL PAGE AND WORK IN BOTH BROWSERS (the onclick property is what you need to look at the others just to change the pic in a scroll over) HTML Code: <img src="icons/home.png" alt="HOME" id="home" onclick="link('home',300)" onmouseover="changePic('home')" onmouseout="changePicBack('home')" width="223" height="134"/>
THIS IS THE JAVASCRIPT FOR WHEN THE LINK IS CLICKED Code: function link(page,size)
{
document.getElementById("iframe").height = size;
document.getElementById("iframe").src = page + ".html";
space = size - 158;
document.getElementById("whitespace").height= space;
}
THIS IS THE CODE FOR THE SIDEBAR 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>
<link rel="stylesheet" type="text/css" href="othercode/formating.css" />
<script type="text/JavaScript" src="othercode/links.js"></script>
</head>
<body>
<p class="sidebar">
<a href="javascript:link('home',300)" target="_parent">Home</a><br /><br />
<a href="javascript:link('blog/blog',650)" target="_parent">Blog</a><br /><br />
<a href="javascript:link('life',680)" target="_parent">Life</a><br /><br />
<a href="javascript:link('links',400)" target="_parent">Links</a><br /><br />
</p>
</body>
</html>
You are probably not going to have all the code you need in this so here are some links This is the main page This is the page for the sidebar iframe This is page for the content iframe This is my CSS This is the javascript that makes the links work Thanks guys if u can make sense of any of my code you are a life saver... all five flavors p.s. and yes the music isnt on there yet i'm making sure i can get this to work first. if have any suggestions on music to put on there feel free to tell me those too Similar TutorialsFor some reason, the main navigation links in this site don't work in Safari 3.1 and latest version of Firefox. They work in IE 6 though. Can't figure it out. http://wcwfc.com/blog/ We have some data that is put into a table with a link to images if available. In Firefox (although only in version 4), the following works: <table> <tr><td></td><td><a><a href="../images/image1.wma" </a>Image label</a>< br />Second line of label (don't want this underlined)</td> ... </table> but the same web page doesn't show any links in Safari (5.0.5). I thought maybe Safari didn't like links in a table, so I removed the table. Still no links. I thought maybe it was the relative reference and made it absolute. No luck. I've tried removing the extra <a> and it doesn't change anything. The extra <a> is to keep the second line from being underlined. What am I missing? Mei I want to embed a social media block on my page that has all the little buttons and all the little links happy together. I almost had it too using this: <p> <a href="http://www.sample site.com" target="_blank"> <img src="http://my image" width="32" height="32" alt="RSS" title="RSS Coming Soon"> </a> This repeated so I had 6 little images for social media connections. In Internet Explorer all links worked, but there was a little line sticking out the right side of each image. In Safari only my last three image links worked but they have no annoying little line. Why? Anyone? Anyone? 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? Hi, I am new to this borad, hope someone good at HTML can help me. I am building a website www.blazeauto.co.uk/shop/ there is a problem with the navigation menu. It work perfects in Firefox and Safari but not in IE. The following are the code I use. <ul id="mainmenu-nav"> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=1" class="txtDefault">Test Category</a></li> </ul> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=2" class="txtDefault">Level1</a></li> </ul> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=4" class="txtDefault">Level2</a></li> </ul> <ul class="ul-nav" <li class="li-nav"><a href="index.php?act=viewCat&catId=5" class="txtDefault">Level3</a></li> </ul> </ul> And this is the CSS code .li-nav a{ font-size: 14px; width: 150px; display: block; text-indent: 2px; font-family: "Trebuchet MS", Verdana, Arial; color: #000000; text-decoration:none; font-weight: bold; background-image:url(/shop/img/linkout.gif); } .li-nav a:hover{ width: 150px; display: block; text-indent: 2px; font-family: "Trebuchet MS", Verdana, Arial; color: #FFFF00; text-decoration:none; background-color: #0066FF; background-image:url(/shop/img/linkover.gif); ----------------------- Can anyone tell me what is wrong? I have been trying for two days with no luck. Thanks Per Anyone know what the problem is. My website works perfect in internet explorer. But when I type in the web address in safari, the page loads all the code, not the website. I'm guessing it has something to do with this 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" xml:lang="en" lang="en"> Any suggestions? Is it this or something else maybe? Is outputting --- Creating linked images < a href= "default.htm"> --- as a line of text next to the image, instead of embedding a link in it. Any ideas what's going on? This is the code: <?xml version = "1.0" encoding = "utf-8"?> <! 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> Using image as hyperlink </title> </head> <body> <p> Creating linked images < a href= "default.htm"> <img src = "DSC00123.JPG" width = "92" height = "100" alt = Testing out stuff> </img> </a> </p> </body> </head> </html> Hi, New to this forum, so apologies if this has been answered before--couldn't find the solution anywhere. I'm working on a page (http://www.dinacheney.com/index.htm), and the rowspan effect is working well on FF. On IE, the chalkboard image gets cut off and the image doesn't line up properly. Is this just rowspan weirdness and I need to rewrite the page using divs or css? Or is there something simpler I can do? All advice is much appreciated!!! Thanks in advance! hello I wanted to make a pop up window for a link: so i put this btw <head> and </head> Code: <script language="javascript" type="text/javascript">
<!--
var win=null;
onerror = stopError;
function stopError(){
return true;
}
function o1281309901(){
myleft=(screen.width)?(screen.width-874)/2:100;mytop=(screen.height)?(screen.height-622)/2:100;
settings="width=874,height=622,top=" + mytop + ",left=" + myleft + ",scrollbars=no,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no,dependent=no";
win=window.open("http://www.christianwalser.com/videoplayer","",settings);
win.focus();
}
// -->
</script>
and then this btw <body> and </body> for the link to open the pop up: Code: <a href="javascript:o1281309901();">LINK It works fine with IE but not with other browser like Safari and FF: --> Its then resizable and the height and wheight arent correct anymore Thank you very much for your help Hello everyone, Im making a website (obviously haha) and the links in a div dont want to work. A piece of text + link works A picture + link doesnt work This div is the header (inc. sepirate logo, name and menu buttons) Below the header div I made a slideshow (which works perfectly (also in a div)) Below the slideshow I made div's in a div with brands of companies + links (which DO work) It doesnt matter if I delete all div's in the header and just put a pic in the header div... the link with that pic still wont work. the link DOES work in expressionweb (ctrl+click) but does NOT work when I put the site online OR test it in any browser (chrome, firefox, IE) HTML 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" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
.style1 {
text-align: center;
}
.style2 {
border-width: 0px;
}
.style4 {
text-align: right;
color: #C0C0C0;
font-size: x-small;
}
</style>
</head>
<body>
<div style="position: relative; width: 800px; z-index: 1; left: 0px; top: 0px; margin-right: auto; margin-left: auto; font-family: Calibri, 'times New Roman', Arial;" id="wrapper">
<div style="position: relative; width: 800px; z-index: 5; left: 0px; top: 0px; height: 785px;" id="new wrapper">
<div style="position: relative; width: 800px; height: 300px; z-index: 1; float: left" id="Header">
<a href="http://www.google.nl/">peterpan</a></div>
<div style="position: relative; width: 700px; height: 300px; z-index: 2; margin: 20px 50px 20px 50px; float: left" id="Slideshow">
<script language="JavaScript1.2">
var variableslide=new Array()
//variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"]
variableslide[0]=['images/slideshow/trollblogo.png', 'http://www.trollbeads.nl/', '']
variableslide[1]=['images/slideshow/trollbeads1.jpg', 'http://www.trollbeads.nl/', '']
variableslide[2]=['images/slideshow/trollbeads2.jpg', 'http://www.trollbeads.nl/', '']
variableslide[3]=['images/slideshow/trollbeads3.jpg', 'http://www.trollbeads.nl/', '']
variableslide[4]=['images/slideshow/trollbeads4.jpg', 'http://www.trollbeads.nl/', '']
variableslide[5]=['images/slideshow/trollbeads5.jpg', 'http://www.trollbeads.nl/', '']
variableslide[6]=['images/slideshow/rosendlogo.png', 'http://www.rosendahl-watches.com/', '']
variableslide[7]=['images/slideshow/rosendahl1.jpg', 'http://www.rosendahl-watches.com/', '']
variableslide[8]=['images/slideshow/rosendahl2.jpg', 'http://www.rosendahl-watches.com/', '']
variableslide[9]=['images/slideshow/rosendahl3.jpg', 'http://www.rosendahl-watches.com/', '']
variableslide[10]=['images/slideshow/trollblogo.png', 'http://www.trollbeads.nl/', '']
variableslide[11]=['images/slideshow/trollbeads6.jpg', 'http://www.trollbeads.nl/', '']
variableslide[12]=['images/slideshow/trollbeads7.jpg', 'http://www.trollbeads.nl/', '']
variableslide[13]=['images/slideshow/trollbeads8.jpg', 'http://www.trollbeads.nl/', '']
variableslide[14]=['images/slideshow/trollbeads9.jpg', 'http://www.trollbeads.nl/', '']
variableslide[15]=['images/slideshow/rosendlogo.png', 'http://www.rosendahl-watches.com/', '']
variableslide[16]=['images/slideshow/rosendahl4.jpg', 'http://www.rosendahl-watches.com/', '']
variableslide[17]=['images/slideshow/rosendahl5.jpg', 'http://www.rosendahl-watches.com/', '']
variableslide[18]=['images/slideshow/rosendahl6.jpg', 'http://www.rosendahl-watches.com/', '']
//configure the below 3 variables to set the dimension/background color of the slideshow
var slidewidth='700px' //set to width of LARGEST image in your slideshow
var slideheight='300px' //set to height of LARGEST iamge in your slideshow, plus any text description
var slidebgcolor='#FFFFFF'
//configure the below variable to determine the delay between image rotations (in miliseconds)
var slidedelay=3000
////Do not edit pass this line////////////////
var ie=document.all
var dom=document.getElementById
for (i=0;i<variableslide.length;i++){
var cacheimage=new Image()
cacheimage.src=variableslide[i][0]
}
var currentslide=0
function rotateimages(){
contentcontainer='<center>'
if (variableslide[currentslide][1]!="")
contentcontainer+='<a href="'+variableslide[currentslide][1]+'">'
contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">'
if (variableslide[currentslide][1]!="")
contentcontainer+='</a>'
contentcontainer+='</center>'
if (variableslide[currentslide][2]!="")
contentcontainer+=variableslide[currentslide][2]
if (document.layers){
crossrotateobj.document.write(contentcontainer)
crossrotateobj.document.close()
}
else if (ie||dom)
crossrotateobj.innerHTML=contentcontainer
if (currentslide==variableslide.length-1) currentslide=0
else currentslide++
setTimeout("rotateimages()",slidedelay)
}
if (ie||dom)
document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')
function start_slider(){
crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub
if (document.layers)
document.slidensmain.visibility="show"
rotateimages()
}
if (ie||dom)
start_slider()
else if (document.layers)
window.onload=start_slider
</script>
<ilayer id="slidensmain" width=&{slidewidth}; height=&{slideheight}; bgColor=&{slidebgcolor}; visibility=hide><layer id="slidenssub" width=&{slidewidth}; left=0 top=0></layer></ilayer>
</div>
<div style="position: relative; width: 800px; height: 400px; z-index: 3; margin: 5px 0px 50px 0px; float: left" id="Merken">
<div style="position: relative; width: 200px; height: 125px; z-index: 1; float: left;" id="layer1" class="style1">
<a href="http://www.eclat.nl/" target="_blank">
<img alt="Eclat" src="images/MainPage/Eclat.png" width="175" height="100" class="style2" style="float: left" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 2; float: left;" id="layer2" class="style1">
<a href="http://www.trollbeads.nl/" target="_blank">
<img alt="Trollbeads" src="images/MainPage/Trollbeads.png" width="175" height="100" class="style2" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 3; float: left;" id="layer3" class="style1">
<a href="http://www.policecitylife.nl/" target="_blank">
<img alt="Police" src="images/MainPage/Police.png" width="175" height="100" class="style2" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 4; float: left" id="layer11" class="style1">
<a href="http://www.rosendahl-watches.com/" target="_blank">
<img alt="Rosendahl" src="images/MainPage/Rosendahl.png" width="175" height="100" class="style2" style="float: right" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 5; float: left" id="layer12" class="style1">
<a href="http://www.jpc.nl/boccia/" target="_blank">
<img alt="Boccia" src="images/MainPage/Boccia.png" width="175" height="100" class="style2" style="float: left" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 6; float: left" id="layer13" class="style1">
<a href="http://www.jeh-collection.nl/" target="_blank">
<img alt="Jeh" src="images/MainPage/Jeh.png" width="175" height="100" class="style2" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 7; float: left" id="layer14" class="style1">
<a href="http://www.danishdesignwatches.eu/" target="_blank">
<img alt="Danish Design" src="images/MainPage/DanishDesign.png" width="175" height="100" class="style2" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 8; float: left" id="layer15" class="style1">
<a href="http://www.rabinovich.nl/" target="_blank">
<img alt="Rabinovich" src="images/MainPage/rabinovich.png" width="175" height="100" class="style2" style="float: right" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 9; float: left" id="layer16" class="style1">
<a href="http://www.cliccreations.nl/" target="_blank">
<img alt="Clic" src="images/MainPage/Clic.png" width="175" height="100" class="style2" style="float: left" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 10; float: left" id="layer17" class="style1">
<a href="http://otracosa.ch/" target="_blank">
<img alt="Otracosa" src="images/MainPage/otracosa.png" width="175" height="100" class="style2" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 11; float: left" id="layer18" class="style1">
<a href="http://www.stepbystep.ch/" target="_blank">
<img alt="Step By Step" src="images/MainPage/StepByStep.png" width="175" height="100" class="style2" /></a></div>
<div style="position: relative; width: 200px; height: 125px; z-index: 12; float: left" id="layer19" class="style1">
<a href="http://www.mobach-groothandel.nl/" target="_blank">
<img alt="Mobach" src="images/MainPage/Mobach.png" width="175" height="100" class="style2" style="float: right" /></a></div>
</div>
</div>
<div class="style4">
Made by Ferdi Bour<br />
________________</div>
</div>
</body>
</html>
In the header is text at this moment with a link. Again, this link DOES work. But as soon as I input an image + link (internal or external doesnt matter) it doesnt work Also interactive buttons I put in the dont work, doesnt so anything Thanks in advance for any solution! Ferdi Bour Hi, I've been going through my codes over and over again but I juz figure out why it won't work this time round for the links. Normally, when I type the html reference inside the ahref, the notepad plus plus will show red but this time it doesn't. When I try to click on the link it won't work as well. Hope someone can tell me why. tks. [html code] <img src="singapore.jpg" alt="Skyscraper" width="700" height="300" hspace="5" name="Rotate"/> <table align ="left" width= 70%> <td width ="30%><a href="BuildGoodNcolor.html">Home</a></td> <td width ="30%><a href="=P-D.html">Projects</a></td> <td width ="30%><a href="PD.comenquiry.html">Enquiry</a></td> <td width ="35%><a href="P-D.html">Contact</a></td></table> [/html code] css : a:link { color: #336699; } a:visited { color: #660033; } a:hover { color: #000000; } Site: http://therivals.summerhost.info Relevant Pages/Files: index.shtml nav.shtml style.css Problem(s): On the side navigation bar, hovering over the 'links' doesn't do anything (even though the stylesheet is supposed to change the background colour/font colour. Clicking also does nothing. I've run both homepage and stylesheet through the W3C Validator and the only errors it comes up with are to do with the ad my host automatically puts at the bottom of each page and CSS3. Interestingly, you cannot highlight anything on the page except that ad. If it's relevant, I've used SSIs to add the code for the navigation bar onto each page. I've tested the site in IE8, Firefox 3.6.19 and Chrome 8.0.552.224. It only works in IE (). It also works when opening the files offline in all the browsers and when using XAMPP. I have absolutely no idea what's gone and would appreciate any helpful input . Simple problem: I have a site with domain http://www.mask.com On the index page of this domain, I want to redirect to www.real.com while cloaking the URL. So I use this: Code: <html> <head> <title>Sob</title> <frameset rows="100%"> <frame src="http://real.com"> </frameset> <noframes> <body>Please follow <a href="http://www.real.com">link</a>!</body> </noframes> </head> </html> This works fine. On real.com, I want to link to real2.html, say, and I want this link cloaked as well. So I instead link to another page, mask2.html, which has the same code as above, but this time redirects to real2.html. The whole point is I need to cloak ALL my links. But when the link (to mask2.html) is clicked, I get a "Page not found" error. However, if I copy the exact address into my browser, it does what it's supposed to and goes to real2.html. I had the impression that it had something to do with frames in frames. I've been trying different targets for my <a href> -- i.e. target="self" or target="_blank", but neither works. Any idea? Hi, so I'm trying to make some links for my website that can easily be modified on all pages but I'm not sure how to go about doing it. my original plan was to use this code: <iframe src="http:///directory.html" style="border: 0" width="100%" height="50" frameborder="0" scrolling="no" target="_parent"></iframe> However from everything I've read this wont work because instead of redirecting the actual page to the correct spot it just sends the frame to that spot leaving the rest of the page the same. And apparently there is no code to make it behave the way that I want it to. So my question is what are my alternatives? I really just want one location where i can update the links, the pictures for the links etc. that way whenever I add a new link or change its location I don't have to do it for 15 other webpages. Anyway, any guidance/help especially in-depth (as I'm not very experienced) would be greatly appreciated. No matter what I do no kind of links work. In this code for an instance the picture link dont work: Code: <html><head><title>a website</title> </head> <body topmargin="0" bottommargin="0" style="background-color: rgb(0, 0, 0);"> <center> <table heigh="" cellpadding="0" cellspacing="0" width="800"> <tbody> <tr> <td colspan="2" background="images/lbar.png" height="500" width="38"></td> <td valign="top"> <table cellpadding="0" cellspacing="0" height="631"> <tbody> <tr> <td valign="top"> <table cellpadding="0" cellspacing="0" height="450"> <tbody> <tr> <td valign="top"> <table cellpadding="0" cellspacing="0"> <tbody> </tbody> </table> </td> <td valign="top"> <table cellpadding="0" cellspacing="0" height="460" width="535"> <tbody> <tr> </tr> <tr> <td valign="top"><font color="#ff9900" face="Verdana, Arial, Helvetica, sans-serif" size="-1"> <A HREF="whatever\whatever.html"><IMG SRC="whatever/whatever.gif" ></A> </font></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td valign="bottom"><img src="blabla/blabla1.png"></td> </tr> </tbody> </table> </td> <td colspan="2" background="blabla/blabla2.png" height="500" width="38"></td> </tr> </tbody> </table> </center> <div style="font-size: 0.8em; text-align: center; margin-top: 1em; margin-bottom: 1em;"> <br> </div> </body></html> Hi there I have a navigation bar on the site im building, but when im in screen resolution 800x600 two of the links do not work, they become unclickable. Here is the html code for one of the pages: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Language" content="EN-GB"> <link rel="stylesheet" type="text/css" href="styles4.css"> <title>Kabasa Guest House and Restaurant</title> <meta name="author" content="xxxxx"> <meta name="description" content="xxxx"> <meta name="copyright" content="2011"> <meta name="keywords" content="xxxxx"> </head> <body> <ul id="navbar"> <li><a href="home5.html">HOME</a></li> <li><a href="menu4.html">MENU</a></li> <li><a href="room4.html">ROOMS</a></li> <li><a href="rates2.html">RATES</a></li> <li><a href="book.html">BOOK</a></li> </ul> <div id="header"> <h1 align="center">Kabasa Guest House and Restaurant</h1> <div id="address"> <pre> xxxxxxx xxxx xxxx 0000000 </pre> </div> </div> <h3>Rates</h3> <div id="rates"> <pre> <u>Our Rates are as follows:</u> <b>Single rooms:</b> Self contained complete with breakfast at only kshs 1500 ($17)<br /> <b>Double rooms:</b> Self contained complete with breakfast at only Ksh 2500 ($28)<br /> <b>Double rooms twin rooms:</b> Self contained complete with breakfast at only Ksh 2500 ($28)<br /> <b>Lunch and dinner</b> is also available at very affordable rates. See our restaurant section for more details.<br /> <b>Our aim </b>is to provide the best service both to local and international clients at the most economical rates. </pre> </div> </body> </html> CSS code: Code: #navbar li {
list-style-type: none;
background-color: #CCFFFF;
margin: -1%;
margin-top: 2%;
position: relative;
top: 20px;
left: -6px;
padding: 1px;
width: 12%;
font-size: 20px;
}
#navbar a:hover {
color: #000;
background: #fff;
}
body {
font-family:Lucida Grande,Tahoma,Helvetica;
font-size:11pt;
color:#000066;
background:#ffffcc;
}
h3 {
position: relative;
top: 15%;
left: 45%;
}
h4 {
position:absolute;
top: 10%;
left: 40%;
}
h5 {
position:absolute;
top: 14%;
left: 36%;
}
h6 {
position: absolute;
margin: auto;
left:0;
right:0;
top: 37%;
width: 520px;
}
#address {
position: absolute;
margin: auto;
left:0;
right:0;
font-weight: bold;
font-size: 10pt;
font-family: arial, sans-serif;
width: 182px;
}
#header {
position: absolute;
margin: auto;
left:0;
right:0;
top: 2%;
width: 800px;
}
p {
position:absolute;
top: 53%;
left: 5%;
}
pre {
margin: 8px 8px;
clear:both;
z-index: 2;
background-color:white;
filter: alpha(opacity=75);
opacity: 0.75;
}
#rates {
position:absolute;
top: 50%;
left: 4%;
width: 85%;
}
When in 1440 x 900 all the links work fine. The two links that stop working in 800x600 are Home and Menu. Any ideas on what could cause this? Many thanks Jackie Hi, pretty new to HTML, any help would be greatly appreciated. My links back to my home page etc e.g. my menu links that link to my root folder work fine in IE but when I try opening them in firefox or Flock none of my links work including my link to my CSS style Sheet. Heres an example of my code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Anime</title> <link rel="stylesheet" type="text/css" href=" /anime2.css"/> </head> <body> <div class="header"> <div class="logo"> <a href="/Anime.html"> <img src="/anime.png" alt-"Anime Hub" style="border-style:none"/> </a> </div> </div> <div class="menu"> <ul> <li> <a href="/anime.html"> Home </a> </li> <li> <a href="/animenews.html"> News </a> </li> <li> <a href="/animes.html"> Animes </a> </li> <li> <a href="/animepreviews.html"> Previews </a> </li> <li> <a href="/animeblog.html"> Blog </a> </li> <li> <a href="/animeforums.html"> Forums </a> </li> </ul> </div> Im using a forward slash for the link to search in my root folder, if I use ../../ to go back two folders it seems to work, but this is tedious and I am sure there must be another way. Please Help Thanks in advance Hi Guys, Here is my website: -family unfriendly link removed- I downloaded this site template somewhere and finished it with all my pictures and stuff. May. I'm an HTML novice in desperate need of an HTML expert. I paid a guy a lot of money to convert my website over from a Microsoft server to a Linux server and the results were mixed. The text links work in Internet Explorer but not in Firefox. http://www.colorado-carpet-masters.com/carpetcleaningBoulder.php I tried taking them out of a table with no luck. For some reason Firefox reads the links as regular HTML instead of a Hyperlink. |
|||||||