...

View Full Version : Why css code not linking



coolioi
01-10-2010, 02:16 PM
Hi guys im having a problem here,
I have css code in my html document.
I tried using link href but it doesnt work! The text in blue is the code im trying to figure out, the code in green is the code im trying to link my html file to the css so you guys can try.


<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>HomeLink 2Link 3Longer Link Text</title>
<link href="css/menu.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="js/menus.js"></script>


<style type="text/css">
#tabsI {
float:left;
width:100%;
background: inherit;
font-size:93%;
line-height:normal;
border-bottom:1px solid #DD740B;
}
#tabsI ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsI li {
display:inline;
margin:0;
padding:0;
}
#tabsI a {
float:left;
background:url("images/tableftI.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}

#tabsI a span {
float:left;
display:block;
background:url("images/tabrightI.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsI a span {float:none;}
/* End IE5-Mac hack */
#tabsI a:hover span {
color:#FFF;
}
#tabsI a:hover {
background-position:0% -42px;
}
#tabsI a:hover span {
background-position:100% -42px;
}

#tabsI a.selected {
background: url('images/lefts.gif') no-repeat left top;
}

#tabsI a.selected span {
background:url("images/rights.gif") no-repeat right top;

}

</style>
</head>

<body>
<div id="tabsI">
<ul>
<li><a onclick="applySelectedTo(this);return false;" href="#" class="selected" title="Link 1"><span>Home</span></a></li>
<li><a onclick="applySelectedTo(this);return false;" href="#" title="Link 2"><span>Link 2</span></a></li>
<li><a onclick="applySelectedTo(this);return false;" href="#" title="Link 3"><span>Link 3</span></a></li>
<li><a onclick="applySelectedTo(this);return false;" href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li>
<li><a onclick="applySelectedTo(this);return false;" href="#" title="Link 5"><span>Link 5</span></a></li>
<li><a onclick="applySelectedTo(this);return false;" href="#" title="Link 6"><span>Link 6</span></a></li>
<li><a onclick="applySelectedTo(this);return false;" href="#" title="Link 7"><span>Link 7</span></a></li>
</ul>
</div>

</body>

</html>

please help

abduraooft
01-10-2010, 02:28 PM
the code in green is the code im trying to link my html file to the css so you guys can try.

If it's an external CSS, then you shouldn't put any HTML tags like <style></style> in it.

coolioi
01-10-2010, 02:43 PM
Well the code in green is the external file im trying to link to, the code is blue is what im trying to use to link the css code! I know that the code <style> </style> isnt part of it!

abduraooft
01-10-2010, 02:44 PM
Well the code in green is the external file im trying to link to, the code is blue is what im trying to use to link the css code!

<style type="text/css">
#tabsI {
float:left;
width:100%;
background: inherit;
font-size:93%;
line-height:normal;
border-bottom:1px solid #DD740B;
}
#tabsI ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsI li {
display:inline;
margin:0;
padding:0;
}
#tabsI a {
float:left;
background:url("images/tableftI.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}

#tabsI a span {
float:left;
display:block;
background:url("images/tabrightI.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsI a span {float:none;}
/* End IE5-Mac hack */
#tabsI a:hover span {
color:#FFF;
}
#tabsI a:hover {
background-position:0% -42px;
}
#tabsI a:hover span {
background-position:100% -42px;
}

#tabsI a.selected {
background: url('images/lefts.gif') no-repeat left top;
}

#tabsI a.selected span {
background:url("images/rights.gif") no-repeat right top;

}

</style> Then remove the highlighted part, as I said above.

coolioi
01-10-2010, 02:45 PM
/*----------------------------------- */
/*---------- Menu ------------ */
/*----------------------------------- */

#tabsI {
float:left;
width:100%;
background: inherit;
font-size:93%;
line-height:normal;
border-bottom:1px solid #DD740B;
}
#tabsI ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsI li {
display:inline;
margin:0;
padding:0;
}
#tabsI a {
float:left;
background:url("images/tableftI.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}

#tabsI a span {
float:left;
display:block;
background:url("images/tabrightI.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsI a span {float:none;}
/* End IE5-Mac hack */
#tabsI a:hover span {
color:#FFF;
}
#tabsI a:hover {
background-position:0% -42px;
}
#tabsI a:hover span {
background-position:100% -42px;
}

#tabsI a.selected {
background: url('images/lefts.gif') no-repeat left top;
}

#tabsI a.selected span {
background:url("images/rights.gif") no-repeat right top;

}

the code above is in a file called menu.css, im trying to link from my html file the file menu.css I tried the code in blue and it didnt work!

abduraooft
01-10-2010, 03:16 PM
<link href="css/menu.css" rel="stylesheet" type="text/css" />Is that path OK with reference to your html file? Could you please post a link to your page?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum