ggkolfin Posted June 19, 2014 Share Posted June 19, 2014 (edited) Hello everyone, I am building a website using WampServer v2.5 on Windows 8. I created a page with some content and a couple of links and it worked fine. In order to fix some layout problems I edited the css file (but actually not the links style) and since then the links do not work at all! I mean the mouse cursor does not change when hover, if I click on the links nothing at all happens and of course the style described in my css is not displayed. This is driving me crazy! I googled the problem but I didn't find anything that helped at all! Can you have a look? This is the html: <!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><link rel="stylesheet" type="text/css" href="myPage.css"><link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Calligraffitti' rel='stylesheet' type='text/css'><title>My title</title></head> <body><div id="holder" style="min-width:1000px; margin: 0 auto;"> <div id="wrapDiv1"> <div id="headerDiv"> <a id="home" href="index.html">Home</a> <!--THIS DOES NOT WORK--> <h3>lorem ipsum</h3> </div> <!--end of headerDiv --> <div id="cornerDiv"> <a id="firstLink" href="aPage.html">First link</a> <!--THIS DOES NOT WORK--> <a id="secondLink" href=anotherPage.php">Second link</a> <!--THIS DOES NOT WORK--> <img src="imagescornerImage.png" width="384" height="192" align="right" hspace="70" /> </div> <!--end of cornerDiv --> <div> <!--end of wrapDiv1 --> <div id="wrapDiv2" align="left"> <h2>lorem ipsum</h2> <p>lorem ipsum</p> <h2>lorem ipsum</h2> <p>lorem ipsum<p> <h2>lorem ipsum</h2> <p>lorem ipsum</p> <h2>lorem ipsum</h2> <p>lorem ipsum</p> </div> <!--end of wrapDiv2 --> <div id="footerDiv"> <p align="center" style=" height:4em; line-height:4em;">Add me on <a href="https://someaddress" target="_blank" style="text-decoration:underline; color:#ffffff ">SomeWhere</a></p> <!--THIS IS THE ONLY LINK THAT WORKS--> </div> <!--end of footerDiv --> </div> <!--end of holderDiv --></body></html> And this is the css: @charset "utf-8";html,body{ height: 100%; background-color: #f1eaee; font-family: 'Droid Serif', serif; color: #505051; }body {margin-top: 7%; }#holder{ position:relative; overflow: hidden; }#wrapDiv1{ height: 15%; width: 100%; padding: 10px; padding-top: 3%; position:relative; }#wrapDiv2{ height: 50%; width: 100%; padding: 10px; padding-bottom: 7%; position:relative; margin-left: 7%; }#headerDiv { width: 50%; height: 15%; float: left; margin-right: 0%; margin-bottom: 7%; display: inline-block; }#cornerDiv { width: 50%; height: 15%; float: right; margin-left: 0%; margin-bottom: 7%; display: inline-block; }#home { margin-left: 14%; color: #505051; font-size:2.8em; text-decoration: none; } #home:hover { color: #00b200; font-family: 'Calligraffitti', cursive; text-decoration: none; }#home:visited {color: #505051; }#firstLink { margin-left: 40%; text-decoration: none; color: #505051; }#secondLink { text-decoration: none; color: #505051; }#firstLink:hover { color: #ff0066; }#secondtLink:hover { color: #ff0066; }#firstLink:visited {color: #505051; }#secondLink:visited {color: #505051; }h3 { margin-left: 15%; }h2 {color: #ff0066}span {font-weight: bold; }#footerDiv { position: absolute; bottom: 0; left: 0; width:100%; height: 7%; background-color: #0066ff; color:#ffffff; font-size:0.75em; } The links are not "clickable" at all!!! Any ideas please? Edited June 19, 2014 by ggkolfin Link to comment Share on other sites More sharing options...
newseed Posted June 19, 2014 Share Posted June 19, 2014 You have a div tag that is open but suppose to be closed. </div> <!--end of cornerDiv --> <div> <!--end of wrapDiv1 --> 1 Link to comment Share on other sites More sharing options...
ggkolfin Posted June 19, 2014 Author Share Posted June 19, 2014 Thanks for the catch! Btw solved. The problem was the relative positioning of the div containing the links. Link to comment Share on other sites More sharing options...
newseed Posted June 19, 2014 Share Posted June 19, 2014 I was able to solved the link problem just by correcting that div to be a closed tag. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now