Log In · Register

 
Image mapping.
funride
post Jul 30 2009, 03:57 PM
Post #1


Funride.org
*****

Group: Member
Posts: 326
Joined: Jul 2007
Member No: 542,299



I'm using the tutorial Erin (theerinkal) sumbitted.
But it isnt working here is my code can someone help me?
CODE
<title>Avril Lavigne - The Best Damn Thing</title>
<html>
<style type="text/css">

body{background-color: #000000;
background-image:url(http://funride.org/selenagomezbackground.png);
background-image: repeat;
color: #000000;
font-family: arial;
text-transform: none;
font-size: 9px;
}



#maincontent{
position: absolute;
overflow: hidden;
top: 425px;
left: 285px;
width: 285px}

#navcolumn{
position: absolute;
overflow: hidden;
top: 423px;
left: 575px;
width: 175px}


textarea{
background-color: #000000;
border: 1px dotted #ffffff;
width: 88px;
height: 50px;
letter-spacing: 0px;
text-transform: uppercase;
font-family: small fonts;
color: #ffffff;
font-size: 9px;}

h1{
width: 100%;
padding: 5px;
margin-bottom: 3px;
background-color: 000000 !important;
color: ffffff !important;
font-family: arial;
font-size: 8pt;
font-weight: none;
text-align: left;
line-height: 8pt;
text-transform: uppercase;
float: left;
margin-left: 0px;}

h2{
width: 100%;
padding: 5px;
margin-bottom: 3px;
background-color: 000000 !important;
color: 774362 !important;
font-family: arial;
font-size: 8pt;
font-weight: none;
text-align: left;
line-height: 8pt;
text-transform: uppercase;
float: left;
margin-left: 0px;}


#banner{
position: absolute;
top: 0px;
left: 0px;
width: 1000px}

#content h1 { margin-left: 0px;
text-align: left; }
#content p { margin-left: 0px;
width: 300px; }


a.navi, a.navi:active, a.navi:link, a.navi:visited{
font-family: arial;
font-weight:normal;
font-size: 8px;
text-transform: uppercase;
letter-spacing:0px;
color:#000000;}

a.navi:hover{
font-family: arial;
font-weight:normal;
font-size: 8px;
letter-spacing:1px;
text-transform: uppercase;
letter-spacing:0px;
color:#774362;
border-left: 3px solid #774362;
}
</style>

<img src="http://funride.org/selenagomez copy.png" width="1024" height="768" border="0" usemap="#map" />

<map name="map">
<!-- #$VERSION:2.3 -->
<!-- #$AUTHOR:Owner -->
<area shape="rect" coords="282,255,400,302" alt="Home" href="#" />
<area shape="rect" coords="403,256,586,303" alt="Content" href="#" />
<area shape="rect" coords="590,255,726,303" alt="Credit" href="http://funride.org" />
</map>




<div id="banner">
<img src="http://funride.org/selenagomez copy.png">
</div>

<div id="maincontent">
<h1>Layout info</h1>
This layout is of Avril Lavigne, my favorite singer!<Br>

Photos:
I blured, soft light and sharpened all of the photos.<br>
Then placed/blended them.<br>
And on a new layer I add the flowers.<br><br>

Coding:
The coding was from our current Funride Layout of David Henrie.<Br>
<Br><br>

Please do not remove out credit.<br>
We spent a lot of time on the layout.<br><br>

Also if you would like more or request a layout e-mail us at nick@funride.org<br><br>
Enjoy the layout! :D<br>
</div>

<div id="navcolumn">
<h2>Navigation</h2>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">domain</a><Br>

<h2>Navigation</h2>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">domain</a><Br>

<h2>Navigation</h2>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">domain</a><Br>

<h2>Navigation</h2>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">link</a><br>
<a href="#" class="navi">domain</a><Br>

<h2>Credit</h2>
Layout: <a href="http://funride.org" class="navi">Here</a><br>
Photo: <a href="http://sweetandtalented.com" class="navi">Here</a><br>
DO NOT REMOVE!
<br>
<br>
</div>
</html>
Reason for edit: Please use [codebox] tags instead of [code] tags when posting longer codes. - Mike
 

Posts in this topic


Closed TopicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members: