please help me

**rorshackles** · 10-01-2007, 08:26 PM

I am a total beginner: For the last two weeks, I have putting in 16 to 18 hours every day trying to repair the work a programmer did for me for my website. I'm at the end of my rope.

The problem is a css file for my mouse-over menu system. The programmer is no longer available - actually, truth is, I think he was in over his head. Anyway, Ive learned as much as I can learn to fix his coding - and I fixed almost all of the problems; but at this point, my nerves are totally shattered. There is only one more major problem to fix. It s specific to Safari ( all versions including the latest). If someone out there can suggest coding to fix my problem, I'd be really really grateful.

Here is my site: www.petersolon.com

The problem has to do with the last tab. The text - inside that tab - doesn't center (inside the tab) on Safari (see attached screenshot). It centers on all other browsers - Opera, FF, IE. (This problem relates to former problems (already resolved) related to aligning that last tab to the right.) I've included an attachment showing what safari does - and another attachment showing what is supposed to happen (and does happen on all other browsers.)

There is another related quirky problem with Safari which is that it doesn't "take" or register the command which tells it to space the letters inside those main tabs. I think there is something wrong with the coding for letter spacing and font size on those main tabs. It goes like this:

.amaintab div div:hover {
font-size:11px;
letter-spacing:0.10em;

Although the other browsers have the letter spacing, changing those settings doesn't change anything on the site.

I have attached the css file for my site> I'll attach the html file in a follow-up e mail. Thank you so much for any help you can give me.

**rorshackles** · 10-01-2007, 08:47 PM

Oops, I attached the js file by mistake. This website won't let me upload the css file and so, I placed its contents in the body of this e mail below. Also I placed the contents of the html file below the css file. Thank you in advance for any help you can give me.

Code:

FULL CSS FILE BELOW
@charset "UTF-8";

body {
	background:black;
	color:white;
}
#container {
	height:70px;
}

#subnav {
	width:632px;   
	}

#maintabs_table {
	background: url(images/purpledot.gif) bottom repeat-x;
}

#maintabs td {
	padding:0px 4.5px;	
	white-space:nowrap;
}
td#lastmaintabtd {	     
	padding-right:0px;     
	padding-left:1px;
	text-align:right;
	}	
div#lastmaintab {
	padding-top:11px;
	padding-left:2px;	
	padding-right:1px;
	padding-bottom:3px;
	text-align:right;
	}
td#tilde {
	padding-right:0px;
	padding-top:5px;
	padding-left:0px;
	}
.maintab div div {
	padding-top:11px;
	padding-left:10px;	
	padding-right:10px;
	padding-bottom:3px;
	text-transform:uppercase;
	font-family:Arial-BoldMT, Arial, sans-serif;
	font-weight:bold;
	cursor:pointer;
	font-size:10px;
	text-align:center;
	height:12px;
}
.amaintab div div:hover {
	font-size:11px!important;
	letter-spacing:0.10em!important;
}
#subnav {
	display:none;
	background: url(images/nav-mid.gif) top repeat-x;
	margin-bottom:2px;
	padding-bottom:10px;		
	margin-left:-3px;
	margin-right:0px;
}
#subnav-left {
	background: url(images/nav-left.gif) no-repeat top left;
}
#subnav-right {
	background: url(images/nav-right.gif) no-repeat top right;
}
#subtabs {
	height:24px;
}

.subtab a, .subtab a:hover, .subtab a:visited {
	padding:0px 15px 0px 15px;
	font-family:Arial-BoldMT, Arial, sans-serif;
	font-weight:bold;
	letter-spacing:0px;
	font-size:9px;
	text-transform:uppercase;
	color:black;
	text-decoration:none;
	line-height:24px;
	vertical-align:middle;
}
.reg {
	font-family:Arial-BoldMT, Arial, sans-serif!important;
	font-size:103%;
	font-size:11px!important;
	}
	
.italics {
	font-family:Verdana, Arial, Helvetica, sans-serif!important;
	font-style:italic;
	font-size:11px!important;
	}

.italics2 {
	font-family:Arial-BoldMT, Arial, sans-serif!important;
	font-style:italic;
	font-size:10px!important;
	}
/* Home */
#maintab1 div div {width:35px}
/* Intro */
#maintab2 div div {width:35px}
/* Writings */
#maintab3 div div {width:60px}
/* Practice */
#maintab4 div div {width:60px}
/* Coolstuff */
#maintab5 div div {width:80px}
/* Events */
#maintab6 div div {width:45px}
/* Buy the Course */
#maintab7 div div {width:110px}

/* Home */

#subtab1 {
	text-align:left;
	padding-left:25px;
}
/* Intro */

#subtab2 {
	text-align:center;
/*	padding-left:30px; 
}
#subtab2 a {
	padding:0px 25px; 
	}
/* Writings */

#subtab3 {
	text-align:left;
	padding-left:6px;
	}
#subtab3 a {
	padding-right:9px;  
	padding-left:9px;
	}
/* Practice */

#subtab4 {
	text-align:center;
	padding-right:60px;
	}
/* Cool Stuff */
#subtab5 {
	text-align:right; /* with text-align:right you align the submenus to the right */
	padding-right:60px; /* with padding-right:xx px you set the padding */
	}
/* Events */

#subtab6 {
	text-align:right;
	padding-right:120px;
	}

/* Buy The Course */

#subtab7 {
	text-align:right;
	padding-right:40px;
	}
/* Possible future subtabs */

#subtab8 {
	text-align:right;
	padding-right:20px;
	}

FULL CONTENTS OF THE HTML FILE BELOW:

<div id="container">
	<div style="position:absolute;left:-1000px">
		<img src="menu/images/tab-left.gif" alt="a" />
		<img src="menu/images/tab-mid.gif" alt="a" />
		<img src="menu/images/tab-right.gif" alt="a" />
	</div>
	<script type="text/javascript" src="menu/topmenu.js"> </script>
	<link rel="stylesheet" href="menu/topmenu.css" type="text/css" />
	<div id="maintabs">
		<table id="maintabs_table" cellpadding="0" cellspacing="0px" border="0" >
			<tr onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
				<td id="tilde"><img src="menu/images/tilde.png" alt="Tilde" /></td>		
				<td>
					<div id="maintab1" class="maintab" onmouseover="showsubtab('subtab1',this)">
						<div>
							<div>Home</div>
						</div>
					</div>
				</td>
				<!-- This is the code for one main-tab -->
				<td>
					<!-- Following line is important at onmouseover="xxx" you write the ID of the submenu to show (e.g. subtab1, subtab2) -->
					<div id="maintab2" class="maintab" onmouseover="showsubtab('subtab2',this)">
						<div>
							<div>Intro</div>
						</div>
					</div>
				</td>
				<!-- It ends here -->
				<td>
					<div id="maintab3" class="maintab" onmouseover="showsubtab('subtab3',this)">
						<div>
							<div>Writings</div>
						</div>
					</div>
				</td>
				<td>
					<div id="maintab4" class="maintab" onmouseover="showsubtab('subtab4',this)">
						<div>
							<div>Practice</div>
						</div>
					</div>
				</td>
				<td>
					<div id="maintab5" class="maintab" onmouseover="showsubtab('subtab5',this)">
						<div>
							<div>Cool Stuff</div>
						</div>
					</div>
				</td>
				<td>
					<div id="maintab6" class="maintab" onmouseover="showsubtab('subtab6',this)">
						<div>
							<div>Events</div>
						</div>
					</div>
				</td>
				<td id="lastmaintabtd">
					<div id="maintab7" class="maintab" onmouseover="showsubtab('subtab7',this)">
						<div>
							<div id="lastmaintab">Buy The Course</div>
						</div>
					</div>
				</td>
			</tr>
		</table>
	</div>
	<div id="subnav"  onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
		<div id="subnav-left">
			<div id="subnav-right">
				<div id="subtabs">
					<!-- Here a subtab starts -->
					<!-- Notive the attribute 'id' it tells the id of the submenu, the main menus refere to that id -->
					<div class="subtab" id="subtab1">
						<a href="Home2.html" title="Home">Return Home</a>
					</div>
					<!-- Here it ends -->
					<div class="subtab" id="subtab2">
						<!--Put any links for the first subtab here -->
						<a href="Overview.html">Overview</a>
						<a href="PointOfView.html">Point of View</a>
						<a href="Mission.html">Mission</a>
						<a href="Questions.html">Questions</a>
						<a href="Bio.html">Bio</a>
						<a href="Bio.html">Contact</a>
					</div>
					<div class="subtab" id="subtab3">
						<a href="Basics1.html" >The Basics</a>
						<a href="History.html" >History</a>
						<a href="OtherTraditions.html" >The Course &amp; Other Traditions</a>
						<!-- Note the 'class' attribute, setting this with the value 'italics' makes the text italic and font:Verdana -->
						<a href="link.html" >The Healing Component</a>
						<a href="WRITINGS.html" class="italics">COMPLETE LIST HERE</a>
					</div>
					<div class="subtab" id="subtab4">
							<!-- Note the attribute target, it makes the link open in a new window -->
							<a target="_BLANK" href="http://www.hiddenpractices.com/Home.html" >Go to our sister site: hidden-practices.com</a>
					</div>
					<div class="subtab" id="subtab5">
						<a href="http://www.petersolon.com/NakedtruthUNDERCON.html" >Naked Truth</a>
						<a href="Solon2.html" >Be a light unto yourself</a>
						<a href="Prather.html" >What is the course</a>
						<a href="COOLSTUFF.html" class="italics">More</a>
					</div>
					<div class="subtab" id="subtab6">
						<a href="EVENTS.html" >Lectures, Workshops &amp; Retreats: Check Our Schedule Here</a>
					</div>
					<div class="subtab" id="subtab7">
						<a href="BUYTHECOURSE.html" class="italics2">A Unique User-Friendly Digital Version Of A Course In Miracles</a>
					</div>
				</div>	
			</div>
		</div>
	</div>
</div>

**djr33** · 10-01-2007, 09:21 PM

Please read: http://www.dynamicdrive.com/forums/s...ad.php?t=24882
Also, I placed the code above in [code] tags. Very helpful for reading.

(That's a lot to go through and at the moment I'm a bit busy, but I'll check it later, or someone else may be able to help. We're not just ignoring you.)

**rorshackles** · 10-02-2007, 07:32 PM

...place the code - i couldn't find it. Maybe you can copy and paste into the body of separate e mail....thanks so much for your reply, Peter

Thread: please help me

Thread Tools

Search Thread

please help me

(corrected) attached files

Daniel, where did you...

Bookmarks

Bookmarks

Posting Permissions