|
HTML - Sidebar/text Displacement
Below is a link to a page on my site:
http://www.freewebs.com/jaceyanimation/about.htm As you can see, the text is displacing the sidebar, and the sidebar displaces the text whenever i swap round the codes. Could someone take a look at the source code below and suggest an answer?: HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML><HEAD>
<TITLE>Site Template</TITLE>
<link rel="shortcut icon" href="http://www.freewebs.com/jaceyanimation/favicon.ico">
<style>
<!--
body {
background-color: white;
font-family: verdana, sans-serif;
font-size: 10px;
text-align: center;
}
td {
font-family: verdana, sans-serif;
font-size: 10px;
}
.outer { padding: 4px}
.header {
border: 1px solid #416A9C;
background-color: #ffffff;
margin-bottom: 10px;
padding: 4px;
font-weight: bold;
font-family: verdana, sans-serif;
font-size: 16px;
background-image: url(http://www.YOUR-SERVER-HERE.com/catbk.gif);
width: 100%;
color: #416A9C;
}
/* The sidebar div contains a table with .holder class and a td cell with .sidebar class */
#sidebar {
width: 100px;
padding: 0px;
}
#sidebar .holder {width: 100px;}
.sidebar {
border: 1px solid #416A9C;
padding: 6px;
font-size: 10px;
text-align:center;
background-color: #ffffff;
}
.sidebarlinks {
padding: 0px;
font-size: 10px;
text-align:center;
background-color: #ffffff;
}
.sidebartitle {
border: 1px #416A9C solid;
color: #ffffff;
padding: 4px;
font-size: 14px;
font-weight: bold;
text-align: center;
background-image: url(http://www.YOUR-SERVER-HERE.com/headingbk.gif);
}
.sidebarsubhead {
border: 1px #416A9C solid;
border-bottom: 0px;
background-color: #416A9C;
padding: 2px;
font-size: 12px;
text-align: center;
background-image: url(http://www.YOUR-SERVER-HERE.com/catbk.gif);
}
.spacer {height: 10px}
#forum {
padding: 0px;
padding-left: 10px;
}
#forum .holder { width:100%;}
.forum {
padding: 0px;
border: 1px solid #416A9C;
background-color: #ffffff;
}
.forumtitle {
border: 1px #416A9C solid;
color: #ffffff;
padding: 4px;
font-size: 14px;
font-weight: bold;
text-align: center;
width: 100%;
background-image: url(http://www.YOUR-SERVER-HERE.com/headingbk.gif);
}
hr { height: 1px; width: 100%; color: #416A9C; border:0px}
a, a:link { color: #416A9C; text-decoration: none}
a:visited { color: #416A9C}
a:hover { color: #416A9C; text-decoration: underline}
a.nav {
height: 20px;
width: 100%;
padding: 4px;
margin-bottom: 1px;
background-color: #ffffff;
border: 1px #416A9C solid;
color: #416A9C;
font-weight: bold;
}
a.nav:hover {
background-color: #416A9C;
color: #ffffff;
}
-->
</style>
</HEAD>
<BODY>
<a href="http://www.freewebs.com/jaceyanimation/index.htm" target="_blank"><img src="http://www.freewebs.com/jaceyanimation/Part%201.PNG" border="0" alt="Jacey"></a><img src="http://www.freewebs.com/jaceyanimation/Part%202.PNG" border="0" alt=""><br>
<a href="http://www.freewebs.com/jaceyanimation/index.htm" target="_blank"><img src="http://www.freewebs.com/jaceyanimation/Part%203.PNG" border="0" alt="Home"></a><a href="http://www.freewebs.com/jaceyanimation/about.htm" target="_blank"><img src="http://www.freewebs.com/jaceyanimation/Part%204.PNG" border="0" alt="About"></a><a href="http://www.freewebs.com/jaceyanimation/product.htm" target="_blank"><img src="http://www.freewebs.com/jaceyanimation/Part%205.PNG" border="0" alt="Products"></a><a href="http://www.freewebs.com/jaceyanimation/game.htm" target="_blank"><img src="http://www.freewebs.com/jaceyanimation/Part%206.PNG" border="0" alt="Game"></a><a href="http://www.freewebs.com/jaceyanimation/animation.htm" target="_blank"><img src="http://www.freewebs.com/jaceyanimation/Part%207.PNG" border="0" alt="Animation"></a><br><img src="http://www.freewebs.com/jaceyanimation/Part%208.PNG" border="0" alt="">
<div id="sidebar">
<table class="holder" cellpadding="0" cellspacing="0" width="100">
<tr>
<td align="center" valign="top" class="sidebarsubhead">Internal Links</td>
</tr>
<tr>
<td class="sidebar">
<a href="http://www.freewebs.com/jaceyanimation/index.htm">Home</a><br>
<a href="http://www.freewebs.com/jaceyanimation/about.htm">About</a><br>
<a href="http://www.freewebs.com/jaceyanimation/product.htm">Products</a><br>
<a href="http://www.freewebs.com/jaceyanimation/game.htm">Game</a><br>
<a href="http://www.freewebs.com/jaceyanimation/animation.htm">Animations</a><br>
</td>
</tr>
<tr>
<td class="spacer"> </td>
</tr>
<tr>
<td align="center" valign="top" class="sidebarsubhead">External Links</td>
</tr>
<tr>
<td class="sidebar">
<table cellpadding="4" cellspacing="1" border="0" width=105" align="center" class="bordercolor">
<DIV ID=oDiv STYLE="position:absolute; width:105px;
height:45px;">
<SPAN STYLE="width:105px">
<tr>
<td width='98%' class='windowbg2' valign='top'>
<marquee onmouseover="this.stop()" onmouseout="this.start()" direction="down" scrollamount="2.5">
<a href="http://beauxbatons22.proboards103.com"><img src="http://i263.photobucket.com/albums/ii158/MHadmins/MHbanner.gif" border="2.1" alt="Magical Hogwarts"></a>
</td>
</tr>
</div>
</table>
</span>
<a href="http://www.freewebs.com/jaceyanimation/index.htm"><img src="http://www.freewebs.com/jaceyanimation/minibanner.gif" style="border-color: red" border="2.1" alt="Jacey Animation"></a>
</td>
</tr>
<tr>
<td class="spacer"> </td>
</tr>
</table>
</div>
</FONT></Body></HTML>
Similar TutorialsHello all- This is my first post on HTML forums, and I hope ya'll can help me out with this issue. I feel really dumb...and think that my problem is probably a simple one, but I can't figure it out. I've got a left sidebar, coded to float left in CSS, and in dreamweaver it shows up appropriately. However, whenever I look on firefox or ie, the left shows up on the right. I've also got an orange background image that DOES show up in the correct spot. I'm wondering if my problem could be related to the fact I've got the image listed under main-content, not the left sidebar. I've moved that line in the CSS, but it didn't help. Here is a link to my problem: http://www.durhamsafekids.org/main.html Here is my CSS code: Code: body {
font-size: 62.5%;
background: url(images/top-bdr.jpg) repeat;
}
p, li {
font: 1.2em/1.8em Sabon, sans-serif;
margin-bottom: 10px;
}
h1 {
font: 2.0em "Helvetica Neue", sans-serif;
color: white;
height: 0px;
}
h2 {
font: 1.8em "Helvetica Neue", sans-serif;
color: #99cc33;
margin-bottom: 10px;
}
h4 {
font :Georgia, "Times New Roman", Times, serif;
color: #0078AA;
}
h3 {
font :Georgia, "Times New Roman", Times, serif;
color: #333399;
}
ul {
margin-left: 25px;
}
img {
border: none;
}
#page-wrap {
background: white;
width: 960px;
margin: 10px auto;
}
#page-wrap #inside {
margin: 10px 10px 0px 10px;
padding-top: 10px;
padding-bottom: 10px;
}
#main-content {
background: url(/images/left-sidebar.gif) repeat-y white;
padding-left: 230px;
padding-top: 20px;
}
#header {
background: #ffffff;
text-align: center;
}
#menu {
background: #ffffff;
}
#left-sidebar {
width: 185px;
float: left;
padding-left: 15px;
padding-top: 20px;
}
#footer {
background: #99cc33;
text-align: center;
padding-top: 20px;
padding-bottom: 20px;
color: #006699;
font-size: 12px;
}
.footer a:link {
/* Applies to unvisited links in class mainNav */
text-decoration: none;
font-weight: bold;
color: #006699;
}
.footer a:visited {
/* Applies to visited links in class mainNav */
text-decoration: none;
font-weight: bold;
color: #006699;
}
.footer a:hover {
/* Applies to links under the pointer in class mainNav */
text-decoration: underline;
font-weight: bold;
color: #006699;
}
/* ================================================================
This copyright notice must be kept untouched in the stylesheet at
all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/pro_drop_2.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */
.preload1 {background: url(menu/three_1.gif);}
.preload2 {background: url(menu/three_1a.gif);}
#nav {padding-left:217px; margin:0; list-style:none; height:38px; background:#fff url(menu/three_0.gif) repeat-x; position:relative; z-index:500; font-family:arial, verdana, sans-serif;}
#nav li.top {display:block; float:left; height:38px;}
#nav li a.top_link {display:block; float:left; height:35px; line-height:33px; color:#ccc; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: url(menu/three_0.gif);}
#nav li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(menu/three_0.gif) right top no-repeat;}
#nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:35px; background: url(menu/three_0a.gif) no-repeat right top;}
#nav li:hover a.top_link {color:#fff; background: url(menu/three_1.gif) no-repeat;}
#nav li:hover a.top_link span {background:url(menu/three_1.gif) no-repeat right top;}
#nav li:hover a.top_link span.down {background:url(menu/three_1a.gif) no-repeat right top;}
/* Default list styling */
#nav li:hover {position:relative; z-index:200;}
#nav li:hover ul.sub
{left:1px; top:38px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:110px; height:auto; z-index:300;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:110px; font-weight:normal;}
#nav li:hover ul.sub li a
{display:block; font-size:11px; height:18px; width:108px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #bbd37e;}
#nav li ul.sub li a.fly
{background:#bbd37e url(menu/arrow.gif) 100px 6px no-repeat;}
#nav li:hover ul.sub li a:hover
{background:#6a812c; color:#fff; border-color:#fff;}
#nav li:hover ul.sub li a.fly:hover
{background:#6a812c url(menu/arrow_over.gif) 100px 6px no-repeat; color:#fff;}
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:110px; top:-4px; background: #bbd37e; padding:3px; border:1px solid #5c731e; white-space:nowrap; width:110px; z-index:400; height:auto;}
#nav ul,
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
#nav li:hover li:hover a.fly,
#nav li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover li:hover a.fly
{background:#6a812c url(menu/arrow_over.gif) 110px 6px no-repeat; color:#fff; border-color:#fff;}
#nav li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li:hover li a.fly
{background:#bbd37e url(menu/arrow.gif) 110px 6px no-repeat; color:#000; border-color:#bbd37e;}
And here is my HTML code: 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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html" />
<title>Durham County Safe Kids</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="style-ie.css" />
<![endif]-->
</head>
<body>
<div id="page-wrap">
<div id="inside">
<div id="header"><!-- #BeginLibraryItem "/library/header.lbi" --><img src="images/Header2.jpg" alt="Durham County Safe Kids" name="headerimage" width="775" height="200" border="1" style="background-color: #CCCCCC">
<!-- #EndLibraryItem --></div>
<div id="menu"><!-- #BeginLibraryItem "/library/menu.lbi" -->
<span class="preload1"></span>
<span class="preload2"></span>
<ul id="nav">
<li class="top"><a href="library/index.html" class="top_link"><span>Home</span></a></li>
<li class="top"><a href="#nogo2" id="safety" class="top_link"><span class="down">Safety</span></a>
<ul class="sub">
<li><a href="#nogo3" class="fly">Vehicle Safety</a><ul>
<li><a href="#nogo4">Car Seats</a></li>
<li><a href="#nogo5">Spot the Tot</a></li>
<li><a href="#nogo6">Hyperthermia</a></li>
<li><a href="#nogo7">Distracted Driving</a></li>
</ul>
</li>
<li><a href="#nogo8">Poison Prevention</a></li>
<li><a href="#nogo9">Wheeled Safety</a></li>
<li><a href="#nogo10">Firearms Safety</a></li>
<li><a href="#nogo11">Water Safety</a></li>
<li><a href="#nogo12">Home Safety</a></li>
<li><a href="#nogo13">Pedestrian Safety</a></li>
</ul>
</li>
<li class="top"><a href="#nogo54" id="events" class="top_link"><span>Events</span></a></li>
<li class="top"><a href="#nogo55" id="links" class="top_link"><span>Links</span></a></li>
<li class="top"><a href="#nogo56" id="photos" class="top_link"><span>Photos</span></a></li>
<li class="top"><a href="#nogo57" id="about" class="top_link"><span>About Us</span></a></li>
</ul>
<!-- #EndLibraryItem --></div>
<div id="left-sidebar">This Text should be in the Orange Left Sidebar.</div>
<div id="main-content"><img src="images/preventingunintentionalinjury.gif" alt="" width="529" height="127" align="right" /><br /><br />
<h2>This website is currently under construction. Please come back soon!</h2>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
<div style="clear: both;"></div><!-- #BeginLibraryItem "/Library/footer.lbi" -->
<div id="footer">
<table align="center" width="50%" border="0" cellspacing="1" cellpadding="1">
<tr>
<th scope="col"><span class="footer"><a href="index.html">Home</a></span></th>
<th scope="col"><span class="footer"><a href="#">Safety</a></span></th>
<th scope="col"><span class="footer"><a href="#">Messages</a></span></th>
<th scope="col"><span class="footer"><a href="#">Links</a></span></th>
<th scope="col"><span class="footer"><a href="#">Photos</a></span></th>
<th scope="col"><span class="footer"><a href="#">About Us</a></span></th>
</tr>
</table>
<br>
<center><font size="+2" color="FFFFFF"><strong>Durham County Safe Kids</strong></font></center>
</div><!-- #EndLibraryItem --></div>
<div style="clear: both;"></div>
</div>
</body>
</html>
As you can see from the linked screenshot, the text shows up on the right side of the page, not in the orange box. http://www.durhamsafekids.org/dskscreen.jpg Thanks all! ~Jeff Hello im new as you can see In Firefox this website "http://gregg.hostzi.com/" (Friends death metal band, has swearing in it) The alignment of the news bar is in the correct position. This is what i want it to look like. When people surf in Internet Explore they get the sidebar all messed up as you can see. My question is how do i align back up? so looks like what it is in Firefox. I hope i have explained what is needed, please ask if you need any further information. Thanks alot. Hi guys I was hoping someone could tell me what is the code for the sidebar nav in this site: http://cloud9fabrics.com/ I really liked it and was hoping to use it in my site, but I couldn't figure it out with all the text and scripts. Could anyone kindly tell me the code so I can use it? Thank you so much! Natalie Hi, I got this template, ( see picture below) Could someone help me to get rid of the side bar on the left but everything else should be as it is. I've attached the index.html as well as the style.css file. Thank you Hi I want several features on my homepage to repeated throughout the website on every page, such as the sidebar, the logo etc. In Dreamweaver, i can link the homepage logo to another page but it won't let me link it to more than one. Is there a command or piece of code that will link each feature to all the pages on the website? Thanks in advance Ox hello all, i am trying to make a sidebar menu like the one at http://www.famousfootwear.com/Shoppi...ts.aspx?N=6208. the idea is that the user would be able to narrow their search, and as they refine it the links that do not apply would collapse. i have been searching for a while and i have no idea what kind of menu i am looking for so if there is a name for this sort of thing i'd love know. or if there is a template? thanks in advance, i need a shove in the right direction! Really hoping someone here can help me! Ok so, I am using the theme he http://www.tumblr.com/theme/10375 Basically, I was trying to change the width of the entire theme to my liking. So in the coding I changed every "900px" to "600px" The code: http://www.heypasteit.com/clip/08PT However in doing that, the "sidebar" of the theme moved down to the footer and I've been looking through the code, trying to change some different things and I just can't figure out what to do to bring it back to the right side. Please help? Thank you kindly http://tinypic.com/r/1t4igj/5 How can I make a floating social media sidebar like this one? I started up a blog recently and used an already made up template. I've altered it a bit to my tastes (still kept all previous credit obviously) but i'm having a hard time putting in a right sidebar in the HTML code. There's already a left sidebar and the main content body but i'm wanting to add a right sidebar to this to balance out the layout. I've tried copying the same html code of the left and altering it to make it right but it doesn't seem to work. If theres anyone that can help me with this it would be greatly appreciated. If anyone wants to see the blog layout and/or html code as present then please do ask. thanks in advance! I have the same sidebar which I would like to use on more then one page of my website. I don't want to have to put it on each page individuality because this is a pain whenever I have to edit it. What I want to be able to do is have one file that is the html of my sidebar and have that show up on each of my pages. But I don't know how to do that. Anyone else know? At the moment I have my sidebar located in a directory above the pages I want it in. Side bar: http://www.invader-stu.com/holland/g...y_sidebar.html A few of the pages I want to put it in: http://www.invader-stu.com/holland/g...s/cartoons_01/ http://www.invader-stu.com/holland/g...s/cartoons_02/ http://www.invader-stu.com/holland/gallery/comics/ http://www.invader-stu.com/holland/g...mics/comic_01/ http://www.invader-stu.com/holland/g...mics/comic_02/ Any help with this GREATLY appreciated. Having a problem with my sidebar breaking as I add text to the page. See he http://www.thebigfootdemo.com/landingpage Can someone point me in the right direction as to what to look for in the code that might be causing this? I'd like the sidebar (green area) to adjust it's height with the amount of text I put into the page. We need the height of the child div to go 100% of the parent div in other words. If I add too much text, the bar breaks as you will see. Thanks so much in advance, Jeff Hello, I have about 25-30 pages on my site. It has a link navigation menu and a sidebar on the left with newsletter opt in, products for sale, etc... I was wondering if there was a way to change/ edit the contents of the sidebar on EVERY PAGE without having to manually go in and change the updated HTML code on every single page. Is there a script that i can use to make this happen that I can just edit the sidebar and it will "update" the sidebar on all 30 pages accordingly?? Rather than manually doing this 30 times for every page my website is http://www.optimumtennis.net thanks in advance I am running into a wall trying to add a sidebar to my tumblr blog. muttonpizza.com I could play with the html code enough to tweak my blog (mostly through trial and error and picking things up on w3schools.com). But I want to add a top left sidebar with the "About this Blog" box I now have at the bottom of my page. And maybe a right sidebar with links. I've done a lot of Googling for help and trying different codes I've found to get this but I just don't have the code right and I cannot figure out where to place it in the code page. I do not have a sidebar at present. I know this should be easy (everything is easy when you know how:-) But I just can't get it to work. First, please tell me how to post my code here. (Could not find it in FAQ) With the help of OleTom I was able to add a sidebar to the background of my blog Thread he http://www.htmlforums.com/html-xhtml...ar-111661.html. I could not fix the problem that it looked different in Fixefox and IE, and changed as you magnified and reduced the webpage. I thought of a new approach and thought I'd ask if this seems doable. If you look at my blog; muttonpizza.com I can increase the padding on the right so that I could have room for a sidebar on the top right in the content body. I would want it to stay in position along side the newest post. I believe this would keep it's size relative to the rest of the page, no matter what browser or size viewed. Here's an example of this: http://thehousingbubbleblog.com/index.html I hope I've explained this. I can post my code for the HTML help. Thanks. I have my sidebar to the bottom center. I want it to the left of my content. l-------------l ----------------------------------------------------------------- l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l l------------ l l----------------------------------------------------------------l That's what I want it to look like. Here's my code right now; <center><TR height=*> <TD bgcolor=2f2f2f valign="left"><font color=eaeaae> <CENTER> <BR><BR> <TABLE border=0> <TR width=25%><TD bgcolor=green><CENTER><FONT SIZE="+3"><A HREF="index.html">Home</A></FONT></CENTER></TD></TR> <TR><TD bgcolor=darkgreen><CENTER><FONT SIZE="+3"><A HREF="characters.html">Characters.</A></FONT></CENTER></TD></TR> <TR><TD bgcolor=green><CENTER><FONT SIZE="+3"><A HREF="mguide.html">Mission Guide</A></FONT></CENTER></TD></TR> <TR><TD bgcolor=darkgreen><CENTER><FONT SIZE="+3"><A HREF="contact.html">Contact</A></FONT></CENTER></TD></TR></center> </CENTER> </font></TD> <TD valign="left"> hi there, i am kind of new to programming and am currently trying to use divs to create a sidebar for my website. I am currently using divs to create a container, a signin banner, a header, content and a footer. I would like the content div split into two further divs though, a left and a right, could someone please help me? below is the html and the css code which i am using... HTML Code: <body>
<div id="container">
<div id="signin-bannerdiv">
<table align="right">
<tr>
<td width="50" align="left">
<p><a href="signin.php" class="a">Sign-In</a></p>
</td>
<td align="left" width="10">
|
</td>
<td width="60" align="left">
<p><a href="register.php" class="a">Register</a></p>
</td>
</tr>
</table>
</div>
<div id="banner">
<?php include ("header.html"); ?>
<?php include ("menu.html"); ?>
</div>
<div id="content">
content
</div>
<div id="footer">
<?php include ("footer.html"); ?>
</div>
</div>
</body>
Code: body {
background: url(images/backgroundmain2.gif) no-repeat center top;
margin: 0px auto;
}
#container{
width:1000px;
position:relative;
margin: 0px auto;
}
#signin-bannerdiv{
height: 60px;
width: 1000px;
background:url(images/signin-banner2.png) repeat-y left;
margin: 0px auto;
text-align:center;
position:inherit;
}
#banner{
width:1000px;
height:175px;
margin: 0px auto;
position:inherit;
}
#content{
background-color:#FFF;
width: 1000px;
height:auto;
min-height: 416px;
margin: 0px auto;
position:inherit;
}
#footer{
background-color:#E0E0E0;
width:1000px;
height:58px;
position:inherit;
margin: 0px auto;
}
Here is what I'm dealing with: http://kr3t3n.com/premiership/ Look at the left sidebar, where the Arsenal links are. I need to put that 10t in the right side, i have used: < li >< a href="http://www.arsenal.com" >1. Arsenal< p style="float:right;width:25px;height:16px;margin:0;padding:0;display:inline;" > 10t < /p > < /a >< /li > but it seems to be wrong, can you please tell me where I'm wrong?!?! Okay. So I need some serious help! I just got a Tumblr and I'm trying to figure out how to replace the little avatar default, in the left sidebar, with an actual picture of me. I was just going to paste the whole HTML code in here but it says it's too big. So here's the link to the code: http://www.cherrybam.com/layouts/pla....php?layout=61 And here's the picture of me I'd like to use: http://static.tumblr.com/xs03htv/5D1logaoa/photo_49.jpg I would certainly appreciate the help! Please and Thank You! Hi The sidebar appears on the bottom of the website I'm editing when I try to add it.I'm not the original webmaster,he abandoned it and I'm helping my friend redo it.We're both inept at html. InstanceBeginEditable name="EditRegionRightSide" --> <!-- InstanceEndEditable --> <h1>MySpace Page</h1> <p><a href="http://www.myspace.com/kellimaroney" target="myspace"><img src="graphics/myspace.gif" alt="Click Here to visit my MySpace page" border="0"></a></p> <p>Don't forget to visit me at <a href="http://www.myspace.com/kellimaroney" target="myspace">myspace.com/kellimaroney</a></p> <div align="center"><br> Check out the <a href="http://movies.groups.yahoo.com/group/kellimaroneyfans/?yguid=188954506" target="_blank">Kelli Maroney Fan Club @ Yahoo! Groups</a><br> </div> <div> <h1 align="center">Follow me on...</h1> <ul class="hnav" style="margin-left: 30px;"> <li><a href="http://twitter.com/Kellimaroney" title="Twitter"><img src="images/twitter.gif" alt="Twitter" width="32" border="0" height="32"></a></li> <li><a href="http://www.facebook.com/kellimaroney?ref=profile" title="Facebook"><img src="images/facebook.gif" alt="Kelli's Facebook Page" width="32" border="0" height="32"></a></li> <li><a href="http://www.youtube.com/user/lovesnerds" title="YouTube"><img src="images/youtube.gif" alt="Kelli's YouTube Channel" width="32" border="0" height="32"></a></li> </ul> </div> <br style="clear: both;"> <br> <div align="center"> <script type="text/javascript"><!-- amazon_ad_tag="kellsonl-20"; amazon_ad_width="120"; amazon_ad_height="600"; amazon_color_border="206BA2"; amazon_color_logo="FFFFFF"; amazon_color_link="206BA2"; amazon_ad_logo="hide"; amazon_ad_title="The Official Kelli Maroney Amazon.Com Store"; //--></script> <script type="text/javascript" src="http://www.assoc-amazon.com/s/asw.js"></script> </div> <script type="text/javascript" src="http://www.assoc-amazon.com/s/link-enhancer?tag=wwwkellimaron-20"> </script> <noscript> <img src="http://www.assoc-amazon.com/s/noscript?tag=wwwkellimaron-20" alt="" /> </noscript> </div></td> </tr> </tbody></table> <p> </p> <table width="798" border="0" cellpadding="0" cellspacing="0"> <tbody><tr> <td><img src="graphics/t_photo.gif" width="798" height="8"></td> </tr> I just made my website - http://www.lucaschu.com to showcase my film work. I'm know little to nothing about HTML and have just modified someone elses. The left sidebar says RSS and ARCHIVE. I want to replace RSS and ARCHIVE with ABOUT and CONTACT. So in my HTML I found this: <!--{block:IfShowRSSAndArchiveInSidebar}--> <h2><a href="{RSS}">{lang:RSS}</a></h2> <h2><a href="/archive">{lang:Archive}</a></h2> <!--{/block:IfShowRSSAndArchiveInSidebar}--> The above HTML seemed to be controlling my sidebar so I modified it to this: <!--{block:IfShowRSSAndArchiveInSidebar}--> <h2><a href="/about">{lang:About}</a></h2> <h2><a href="/contact">{lang:Contact}</a></h2> <!--{/block:IfShowRSSAndArchiveInSidebar}--> I was trying to make the ABOUT icon link to lucaschu.com/about & the CONTACT icon to lucaschu.com/contact The CONTACT was successful but the ABOUT failed. The word ABOUT just didn't show up. I suspect it has to do with the RSS? Help me to do this! |
|||||||