Anyway to put text links above posts without using image mapping? |
![]() ![]() |
Anyway to put text links above posts without using image mapping? |
Apr 28 2006, 09:53 PM
Post
#1
|
|
|
Newbie ![]() Group: Member Posts: 2 Joined: Dec 2005 Member No: 325,258 |
This is my xanga:
http://www.xanga.com/kanikuma I made the layout. Instead of dealing with image mapping, I would like to be able to put two or three regular text links above the posts. ![]() The red area is where I would like to put this regular text. Is there any way I can easily accomplish this? |
|
|
|
| *digital.fragrance* |
Apr 28 2006, 10:00 PM
Post
#2
|
|
Guest |
ARe you familiar with div layers? If so, you can use margin attributes to position your links on teh page wherever you want!
Example: CODE <div style="position: absolute; width: ##px; height: ##px; margin-top:##px; margin-left: ##px;">
<a href="http://xanga.com">xanga.com</a> </div> |
|
|
|
Apr 28 2006, 10:05 PM
Post
#3
|
|
|
Newbie ![]() Group: Member Posts: 2 Joined: Dec 2005 Member No: 325,258 |
Thank you very much!
I used it, and stuff's all weird now...Can you give me a step-by-step process? |
|
|
|
| *digital.fragrance* |
Apr 28 2006, 10:12 PM
Post
#4
|
|
Guest |
Put it under your image code and make sure to edit the "##" with actual number values. It will take some trial and error to get the positioning right, but it will work.
CODE <img src="http://img.photobucket.com/albums/v190/Wafflecat/kanikumilayout.png">
<div style="position: absolute; width: ##px; height: ##px; margin-top:##px; margin-left: ##px;"> <a href="http://xanga.com">xanga.com</a> </div> <div style="overflow: auto; width: 700px; height: 350px; margin-top: -485px; margin-left: 50px;"> <style type="text/css"> table.navigation, table.footer { display:none; } </style> <!-- begin code provided by createblog.com --> <style type="text/css"> .#rblEprops{display:none;} #pnlEnabled table, #htmleditor, #lblTimeZone, #pnlEprops, #rblEprops /* width of the comment page */ {width:245px;} .leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer {display: none;} </style> <!-- end code provided by createblog.com --> <style type="text/css"> /* Name of Your Skin - By You*/ body {background-color: #COLOR CODE; scrollbar-arrow-color: #CC9966; scrollbar-track-color: #FFCC99; scrollbar-shadow-color: #996600; scrollbar-face-color: #COLOR CODE; scrollbar-highlight-color: #COLOR CODE; scrollbar-darkshadow-color: #COLOR CODE; scrollbar-3dlight-color: #COLOR CODE;} /* edits the date */ div.blogheader, .caption {background-image: url(); background-repeat:no-repeat; background-position:center; font-family: verdana; text-transform:none; font-size:#8px; line-height:#px; font-weight:normal; color:#FFCC00; letter-spacing:2px; background-color:#COLOR CODE; text-align:center; border:1px solid #COLOR CODE;} .blogbody b, .standard b, p b, strong { /* edits bolded text in your entry */ font-weight: bold; color: #COLOR CODE;} input, select, textarea, iframe.htmleditor, .textfield, .button { /* this edits the buttons, dropdowns, etc. */ border: #px solid #COLOR CODE; font:normal #px verdana; background-color: #COLOR CODE; font-color:#COLOR CODE;} table.footer TD { /* this makes the footer at the bottom centered */ /* leave it alone unless you know what to do*/ text-align: center;} table.left th { /* on your menu module, this edits the title part of it */ /* like BLOGRINGS, POSTING CALENDAR, etc */ background-image: url(); background-color:none; color: #COLOR CODE; font: bold #pt verdana; text-transform: none; text-align:center; border: #COLOR CODE #px solid;} table.left { /* this edits the menu module */ width:180px; color:000000; background-color:#COLOR CODE; BORDER: #COLOR CODE #px solid;} font,td,p,xmp {color:#COLOR CODE; font-face: verdana; font-weight:normal; font-size:#pt; text-align:justify;} table.blogbody tr td { /* this edits the left margin of blog */ width:0px; padding-left: 0px;} table.blogbody { /* this edits the other the place where the blog is */ background-color:transparent; family-font: verdana; BORDER: #COLOR CODE #px solid; width:###px;} /* <-- The width for this should be around 5-15 pixels less then the width for your blog's div layer. */ a:link {line-height: #pt; font-family: verdana; font-weight:normal; color:#COLOR CODE; text-transform:none; font-size:8#pt; cursor:crosshair;} a:active {font-family: FONT FAMILY; color:#COLOR CODE; text-transform:none; font-size:#pt; cursor:crosshair;} a:visited {font-family: verdana; color:#COLOR CODE; text-transform:none; text-decoration:strikeout; font-size:#pt; cursor: crosshair;} A:hover {font-family:verdana; color:#COLOR CODE; text-transform: uppercase; cursor: crosshair; font-weight:bold; font-size:#pt}</style> |
|
|
|
![]() ![]() |