Log In · Register

 
 
Closed TopicStart new topic
Anyway to put text links above posts without using image mapping?
Grim Shogun
post 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*
post 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>
 
Grim Shogun
post 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*
post 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>
 

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