www.webdeveloper.com
Results 1 to 10 of 10

Thread: Re-Entering the web development field

  1. #1
    Join Date
    Jul 2012
    Posts
    5

    Angry Re-Entering the web development field

    hello,
    i am running into a problem with my links. i added them to the contact page and they would not work at all. then i added them to the homepage and they worked. if i delete one of the other paragraphs on the page they stop working again. if i add a heading they stop working also. this doesn't make any sense to me. btw, i am using Chrome. i tried my site in Firefox and it is the same result. they work in internet explorer. if anyone can help i would appreciate it.

  2. #2
    Join Date
    Jun 2006
    Location
    Boston, MA
    Posts
    383
    can you provide a link to the site or your code?

  3. #3
    Join Date
    Jul 2012
    Posts
    5

    Smile the links do not work

    <!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>Contact Page</title>

    <meta http-equiv="Content-Type" content="text/html;charset="utf-8" />
    <meta name="Keywords" content="personal training, home fitness, pilates, yoga, in-home, training" />
    <!--change keywords to suit my site-->
    <link href="style1.css" rel="stylesheet" type="text/css"/>
    </head>

    <body>
    <div id="header">
    <div id="spirelogo">
    <img src="logo.spire4.png" alt="Spire fitness logo" width="300" height="80"/>
    </div><!--end spirelogo-->
    <div id="headimg1">
    <img src="CollenSquats01.jpg" alt="weight training" width="133" height="133"/>
    </div><!--End Head image div-->
    <div id="headimg2">
    <img src="CollDir1.jpg" alt="yoga pose" width="133" height="133"/>
    </div><!--end headimg2-->
    <div id="headimg3">
    <img src="pilates2.jpg" alt="pilates pose" width="133" height="133"/>
    </div><!--end headimg3-->
    <div id="headimg4">
    <img src="running1.jpg" alt="running picture" width="133" height="133"/>
    </div><!--end headimg4-->
    </div><!--end header-->

    <div id="navigation1">
    <ul>
    <li><a href="spirehome.html">home</a></li>
    <li><a href="contact1.html">contact us</a></li>
    <li><a href="about.html">about us</a></li>
    <li><a href="services.html">services</a></li>
    <li><a href="resources.html">resources</a></li>

    </ul>
    </div><!--end navigation1 div-->

    <div id="leftpane">
    <img src="colleenriver01.jpg" width="170" height="170" alt="Colleen Brophy at Bristol wharf"/>
    <p><b>Colleen Brophy - Head Trainer</b><br>
    <b>Phone:610-348-1118</b><br>
    <b>Ace Certified Personal Trainer</b><br>
    <b>Red Cross Certified</b></p>
    </div><!--end leftpane div-->

    <div id="bodycontent">





    <p>If you have any questions please contact Colleen. Please include contact information.<a href="mailto:http://www.spirefit@gmail.com">Colleen@SpireFitness</a></p>
    <p>We are are also on Facebook<a href="http://www.facebook.com/spirefitness">Facebook</a></p>

    </div><!--end bodycontent div-->






    </body>
    </html>

  4. #4
    Join Date
    Jun 2006
    Location
    Boston, MA
    Posts
    383
    The only link i see a problem with is your email link. is that the one you're talking about. you have to be more specific.

    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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Contact Page</title>
    <meta name="Keywords" content="personal training, home fitness, pilates, yoga, in-home, training" />
    <link href="style1.css" rel="stylesheet" type="text/css"/>
    </head>
    
    <body><div id="header">
    <div id="spirelogo">
    <img src="logo.spire4.png" alt="Spire fitness logo" width="300" height="80"/>
    </div><!--end spirelogo-->
    <div id="headimg1">
    <img src="CollenSquats01.jpg" alt="weight training" width="133" height="133"/>
    </div><!--End Head image div-->
    <div id="headimg2">
    <img src="CollDir1.jpg" alt="yoga pose" width="133" height="133"/>
    </div><!--end headimg2-->
    <div id="headimg3">
    <img src="pilates2.jpg" alt="pilates pose" width="133" height="133"/>
    </div><!--end headimg3-->
    <div id="headimg4">
    <img src="running1.jpg" alt="running picture" width="133" height="133"/>
    </div><!--end headimg4-->
    </div><!--end header-->
    
    <div id="navigation1">
    <ul>
    <li><a href="spirehome.html">home</a></li>
    <li><a href="contact1.html">contact us</a></li>
    <li><a href="about.html">about us</a></li>
    <li><a href="services.html">services</a></li>
    <li><a href="resources.html">resources</a></li>
    
    </ul>
    </div><!--end navigation1 div-->
    
    <div id="leftpane">
    <img src="colleenriver01.jpg" width="170" height="170" alt="Colleen Brophy at Bristol wharf"/>
    <p><b>Colleen Brophy - Head Trainer</b><br>
    <b>Phone:610-348-1118</b><br>
    <b>Ace Certified Personal Trainer</b><br>
    <b>Red Cross Certified</b></p>
    </div><!--end leftpane div-->
    
    <div id="bodycontent">
    
    <p>If you have any questions please contact Colleen. Please include contact information.<a href="mailto:Colleen@SpireFitness">Colleen@SpireFitness</a></p>
    <p>We are are also on <a href="http://www.facebook.com/spirefitness">Facebook</a></p>
    
    </div><!--end bodycontent div-->
    </body>
    </html>

  5. #5
    Join Date
    Jul 2012
    Posts
    5

    links do not work

    the email and the facebook that are located in the bodycontent div. any help you can give me would be appreciated. it makes no sense, they work until i add something to the page. if i add another paragraph or header they stop working.

  6. #6
    Join Date
    Jun 2006
    Location
    Boston, MA
    Posts
    383
    i updated the email one to work correctly for you. besides that the rest work fine so im not sure what you mean. can you add another paragraph or header to the page and send me the code to look at? also please place your code within the <> brackets in the reply editor(right above the white box), that way none of the characters are converted.

  7. #7
    Join Date
    Jul 2012
    Posts
    5

    links do not work

    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>Spire Fitness Homepage</title>
    	
    	<meta http-equiv="Content-Type" content="text/html;charset="utf-8" />
    	<meta name="Keywords" content="personal training, home fitness, pilates, yoga, in-home, training" />
    <!--change keywords to suit my site-->
    <link href="style1.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>  
    <div id="header">
    		<div id="spirelogo">
    			<img src="logo.spire4.png" alt="Spire fitness logo" width="300" height="80"/>
    		</div><!--end spirelogo-->
    		<div id="headimg1">
    			<img src="CollenSquats01.jpg" alt="weight training" width="133" height="133"/>
    		</div><!--End Head image div-->
    		<div id="headimg2">
    			<img src="CollDir1.jpg" alt="yoga pose" width="133" height="133"/>
    		</div><!--end headimg2-->
    		<div id="headimg3">
    			<img src="pilates2.jpg" alt="pilates pose" width="133" height="133"/>
    		</div><!--end headimg3-->
    		<div id="headimg4">
    			<img src="running1.jpg" alt="running picture" width="133" height="133"/>
    		</div><!--end headimg4-->
    </div><!--end header-->
    
    <div id="navigation1">
        <ul>
    	 <li><a href="spirehome.html">home</a></li>
    	 <li><a href="contact1.html">contact us</a></li>
    	 <li><a href="about.html">about us</a></li>
    	 <li><a href="services.html">services</a></li>
    	 <li><a href="resources.html">resources</a></li>
        </ul>
    </div><!--end navigation1 div-->
    
    <div id="leftpane">
       <img src="colleenriver01.jpg" width="170" height="170" alt="Colleen Brophy at Bristol wharf"/>
       <p><b>Colleen Brophy - Head Trainer</b><br>
       <b>Phone:610-348-1118</b><br>
       <b>Ace Certified Personal Trainer</b><br>
       <b>Red Cross Certified</b></p>
    </div><!--end leftpane div-->
       
    <div id="bodycontent">
    	<h1>Contact Us</h1>
    	<div id="links">
    	<ul>
    		<li>For more information contact:<a href="mailto:http://www.spirefit@gmail.com">  Colleen@SpireFitness.com</a></li>
    		<li>Visit our Facebook page at:<a href="http://www.facebook.com/spirefitness">  facebook.com/spirefitness</a></li>
    		<li>Visit our Blog at:<a href="http://www.worthit2bwell.wordpress.com">  worthit2bwell.wordpress.com</a></li>
    		
    	</ul>
    	</div>
    	
    	</div><!--end bodycontent div-->
    </body>
    </html>

  8. #8
    Join Date
    Jul 2012
    Posts
    5

    I think my CSS is causing the problem

    Code:
    /*CSS stylesheet1 for spirefitness.com*/
    /*COMPLETE FONT-FAMILY FOR ELEMENTS*/
    h1, h2, h3{
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	height: 20px;
    	border: 0px solid navy;
    	color:navy;
    	margin-bottom:5px;
    	margin-top:5px;
    	}
    	
    table{
    	border-collapse:collapse;
    	width:85%;
    	margin-left:25px;
    	}
    	
    table, td, th{
    	border:2px solid navy;
    	}
    	
    th{
    	background-color:navy;
    	color:white;
    	}
    
    body{
    	background-repeat:y-right;
    	}
    								/*HEADER ELEMENTS*/
    #header{
    	padding-left:5px;
    	padding-top:5px;
    	padding-right:5px;
    	padding-bottom: 5px;
    	text-align:;
    	background:;
    	width:68%;
    	border: px solid black;
    	margin:0px;
    	height:100px;
    	-moz-border-radius: 0em 0em 0em 0em;
    	border-radius: 0em 0em 0em 0em;
    	
    	}
    #spirelogo{
    	background-image:url(blueabstract2.jpg);
    	height:130px;
    	width:40%;
    	z-index:;
    	-moz-border-radius: 120px 0px 0px 0px;
    	border-radius: 120px 0px 0px 0px;
    	border-top:2px solid navy;
    	border-bottom:2px solid navy;
    	border-left:2px solid navy;
    	border-right:2px solid navy;			
    	}
    #headimg1{
    	z-index:;
    	border-top:px inset navy;
    	border-bottom:px inset navy;
    	border-right:px inset navy;
    	border-left:px inset navy;
    	background-image:url(.png);   
    	}
    #leftpane{
    	z-index:1;
    	border:2px solid navy;
    	border-bottom:;
    	border-right:;
    	border-left:;
    	height:590px;
    	width:395px;
    	background-image:url(blueabstract2.jpg);
    	}
    		
    #navigation1{
    	z-index:2;
    	border:px solid black;
    	height:30px;
        background-color:;
        clear:both;
        padding-top:;
        font-size:15px;
        width:100%;
    	}
    #navigation1 ul{
        list-style:none;
    	width:1000px;
    	}
    #navigation1 ul li{
    	-moz-border-radius: 0em 2em 2em 0em;
    	border-radius: 0em 2em 2em 0em;
    	moz-box-shadow: 5px 10px 10px #888;
    	-webkit-box-shadow: 5px 10px 10px #888;
    	box-shadow: 5px 10px 10px #888;
    	height:20px;
    	display:block;
    	width:25%;
    	text-decoration:none;
    	text-align:right;
    	padding-right:7px;
    	padding-left:7px;
    	padding-top:5px;
    	padding-bottom:10px;
    	margin-left:25px;
    	margin-bottom:20px;
    	font-size:x-large;
    	background-image:url(parchment.jpg);
    	}
    					
    body{
    	background-image:url(parchment.jpg);
    	}
    #bodycontent {
    	z-index:;
    	font-family:;
    	border:2px solid black;
    	width:557px;
    	height:590px;
    	background-color:#C9EEFF;
    	-moz-box-shadow: 5px 10px 10px #888;
    	-webkit-box-shadow: 5px 10px 10px #888;
    	box-shadow: 5px 10px 10px #888
    	-moz-border-radius: 0px 0px 120px 0px;
    	border-radius: 0px 0px 120px 0px;
    	}
    	
    #bodycontent p{
    	text-wrap:right;
    	padding-left:20px;
    	padding-right:20px;
    	padding-top:0px;
    	padding-bottom:0px;
    	border:px solid navy;
    	color:black;
    	line-height:100%;
    	text-indent:0px;
    	margin-top:10px;
    	margin-bottom:0px;
    	margin-left:10px;
    	width:500px;
    	font-size:medium;
    	}
    	
    #bodycontent h1, h2, h3{
    	text-align:center;
    	margin-bottom:20px;
    	}
    #leftpane p{
    	font-size:small;
    	}
    #leftpane img{
    	border:5px solid white;
    	}
    
    											/*Positioning*/
    													
    #header, #bodycontent, #spirelogo, #spirelogo img, #navigation1, #navigation1 ul, #leftpane, #leftpane p, #leftpane img,  
    #headimg1, #headimg2, #headimg3, #headimg4{
    	position: absolute;	
    	}
    #headimg1{
    	top:0px;
    	left:408px;
    	}
    	#headimg2{
    		top:0px;
    		left:550px;
    		}
    	#headimg3{
    		top:0px;
    		left:692px;
    		}
    	#headimg4{
    		top:0px;
    		left:835px;
    		}
    #spirelogo{
    	top:0px;
    	left:0px;
    	}
    	#spirelogo img{
    		top:30px;
    		left:50px;
    		}
    #leftpane{
    	top:143px;
    	left:238px;
    	}
    	#leftpane img{
    		top:400px;
    		left:10px;
    		}
    		#leftpane p{
    			top:420px;
    			left:200px;
    			}
    #navigation1{
    	top:200px;
    	left:235px;
    	}
    	#navigation1 ul{
    	top:00px;
    	left:-24px;
    	}
    #header{
    	left:238px;
    	top:0px;
    	}
    #bodycontent{
    	top:143px;
    	left:645px;
    	}

  9. #9
    Join Date
    Jun 2006
    Location
    Boston, MA
    Posts
    383
    you need to add dimensions to your navigation elements, for whatever reason you made the entire sites position absolute so divs are overlaying eachother. i would recommend starting over and not using absolute positioning at all. floats would be fine and much easier.

    you have an extra quote in here to.

    HTML Code:
    <meta http-equiv="Content-Type" content="text/html;charset="utf-8" />
    should be
    HTML Code:
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  10. #10
    Join Date
    Jun 2006
    Location
    Boston, MA
    Posts
    383
    start with something simple like this..

    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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style>
    body{margin:0;padding:0;font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;font-size:12px;}
    img{border:none;}
    
    #container{width:960px;height:auto;position:relative;margin:0 auto;}
    #header{float:left;width:960px;height:120px;margin-bottom:20px;}
    
    #content{float:left;width:960px;}
    #content-left{float:left;width:380px;height:400px;margin-right:20px;}
    #content-right{float:left;width:560px;height:400px;}
    </style>
    </head>
    <body>
    <div id="container"><!--container start-->
    
    <div id="header"></div>
    
    <div id="content"><!--content start-->
    <div id="content-left"></div>
    <div id="content-right"></div>
    </div><!--content end-->
    
    </div><!--container end-->
    </body>
    </html>

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles