Oh hey, look, I have another problem 83

Linkin-Dreamer · #1 09-29-2011, 11:01 AM

Hey x3

I'm having some problems intergrating a script I found with my template 83

This is the script -

HTML Code:

<html> 
<head> 
<title>CSS based drop-down menu</title>	
	<style type="text/css"> 
ul {
	font-family: Arial, Verdana;
	font-size: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
	}
ul li {
	display: block;
	position: relative;
	float: left;
	}
li ul {
	display: none;
	}
ul li a {
	display: block;
	text-decoration: none;
	color: #ffffff;
	border-top: 1px solid #ffffff;
	padding: 5px 15px 5px 15px;
	background: #2C5463;
	margin-left: 1px;
	white-space: nowrap;
	}
ul li a:hover {
	background: #617F8A;
	}
li:hover ul { 
	display: block; 
	position: absolute;
	}
li:hover li { 
	float: none;
	font-size: 11px;
	}
li:hover a {
	background: #617F8A;
	}
li:hover li a:hover {
	background: #95A9B1;
	}
	</style>		
</head> 
<body> 
	<ul id="menu"> 
			<li><a href="">Home</a></li> 
			<li><a href="">About</a> 
			<ul> 
			<li><a href="">The Team</a></li> 
			<li><a href="">History</a></li> 
			<li><a href="">Vision</a></li> 
			</ul> 
			</li> 
			<li><a href="">Products</a>
			<ul> 
		        <li><a href="">Cozy Couch</a></li> 
		        <li><a href="">Great Table</a></li> 
		        <li><a href="">Small Chair</a></li> 
		        <li><a href="">Shiny Shelf</a></li> 
		        <li><a href="">Invisible Nothing</a></li> 
			</ul> 
			</li> 
			<li><a href="">Contact</a> 
			<ul> 
		        <li><a href="">Online</a></li> 
		        <li><a href="">Right Here</a></li> 
		        <li><a href="">Somewhere Else</a></li> 
			</ul> 
			</li> 
			</ul>
</body> 
</html>

I'm using the Spooky Wood and Simple themes and I'd like to integrate it into both x3

Any help?

Linkin-Dreamer · #2 09-29-2011, 11:07 AM

Oh, if it helps, these are my CSS's

Code:

body {
background:url("images/bottom.png") fixed no-repeat bottom right #1e1f2c;
color:#FFFFFF;
font-family:arial, tahoma, sans-serif;
font-size:12px;
}

#linksbar {
background:url("images/linksbar.png");
width:100%;
z-index:2;
height:50px;
position:fixed;
top:0px;
left:0px;
}
#header {
background:url("images/right-bg.png") repeat;
width:100%;
z-index:2;
position:fixed; top:50px; left:0px;
}
#hleft {
position:absolute; top:50px; left:0px;
}

#sidefeed {
background:url("images/sidefeedbg.png") top no-repeat #2C3C55;
position:fixed; top:50px; left:50px;
height:auto;
width:200px;
z-index:2;
color:#eee;
border-top:0px solid #2C3C55;
border-left:0px solid #2C3C55;
border-right:0px solid #2C3C55;
border-bottom:0px solid #2C3C55;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
border-bottom-left-radius:10px;
border-bottom-right-radius:10px;
}

#sidefeed p {
padding:2px;
margin:5px;
}


#hright {
height:199px;
z-index:2;
position:fixed; top:50px; left:250px;
}

#content {
width:700px;
position:absolute;
top:252px;
z-index:1;
left: 265px;
background:url("images/bg2.png");
border:1px solid #aaa;
-moz-border-radius: 10px;
border-radius:10px;
margin:5px;
}
#content p {
padding:10px;
}

#footer {
}
#footer p{
text-align:center;
background:none;
border:0px solid;
padding:10px;
}

#linksbar ul{
position:inherit;
top:7px;
left:245px;
font-family: Baskerville, 'Goudy Old Style', Palatino, 'Book Antiqua', serif;
font-size:12px;
width:100%;
margin: 0 auto;
list-style:none;
}
#linksbar li {
display:inline;
}
#linksbar p{
position:inherit;
left:250px;
margin: 0 auto;
}
#linksbar a{
color:#fff;
text-shadow: 1px 1px 1px #aaa;
padding:0 auto;
float:left;
text-align: center;
text-transform:uppercase;
text-decoration:none;
font-weight:bold;
border-bottom:0px solid;
padding:10px;
}
#linksbar a:hover{
color:#eee;
text-decoration:none;
text-shadow: 0px 1px 1px #343434;
border-bottom:0px solid;
}

table {
border:0;
width:100%;
margin:5px;
}
td {
border:0;
}
#sidefeed a {
color:#ADC8F0;
text-decoration:none;
border-bottom:1px dotted;
}
#sidefeed a:hover {
color:#F0ADC0;
text-decoration:underline;
border-bottom:1px dotted;
}
a {
color:#4075CB;
text-decoration:none;
border-bottom:1px dotted;
}
a:hover {
color:#F26CF0;
text-decoration:underline;
border-bottom:1px dotted;
}
#sidefeed strong, b span {
color:#aaa;
}
#sidefeed em, i span{
color:#aeaeae;
}
u {
color:#343434;
}
#content em, i {
color:#207DA4;
}
#content strong, b {
color:#BF2222;
}
#sidefeed input, select {
background:transparent;
border: 1px outset #aaa;
width:auto;
height:20px;
color:#fff;
font-style:italic;
margin:5px;
}

input, select {
background:transparent;
border: 1px outset #aaa;
width:auto;
height:20px;
color:#333;
font-style:italic;
margin:5px;
}
textarea {
background:#CCCCCA;
border-bottom: 1px solid #CCCCCA;
border-top: 1px solid #efefef;
border-left: 1px dotted #efefef;
width:100%;
height:50px;
color:#333;
font-style:italic;
border-right: 1px solid #000;
}


blockquote {
font-family:Consolas, sans-serif;
padding:5px 10px;
color:#333;
border-left:5px solid #fff;
margin:10px;
}

code {
color:#4787ff;
font-family:Courier New;
font-style:italic;
}

img {
border:0px;
}

h1 {
font-size:24px;
border-bottom:1px solid;
text-shadow: 1px 1px 1px #fff;
margin:10px;
}

h2 {
font-size:12px;
border-bottom:1px solid;
margin:10px;
}

#sidefeed ul{
list-style-type:none;
padding:5px;
}
#sidefeed li {
list-style-type:none;
line-height:20px;
}
#sidefeed li a {
color:#efefef;
text-decoration:none;
}
#sidefeed li a:hover {
color:#478792;
text-transform:uppercase;
text-decoration:none;
}

Code:

body {
color:#FFF;
background:#eee url(http://i1114.photobucket.com/albums/k533/CaLinMu/Background-1.png) fixed;
font-size:12px;
font-family:Arial, Verdana, sans-serif;
}

#container {
margin:0 auto;
background:url(http://i1114.photobucket.com/albums/k533/CaLinMu/Wrapper.png);
width:800px;
}

#menu {
width:800px;
border-bottom:#000 solid 5px;
font-size:12px;
margin:0 auto;
}
#menu ul{
margin-top:-35px;
list-style:none;
}
#menu li {
display:inline;
}
#menu a{
color:#aaa;
text-transform:uppercase;
display: block;
border-left:0px dotted #000;
float:left;
text-align: center;
text-decoration:none;
font-weight:bold;
padding:10px;
}
#menu a:hover{
color:#333;
text-decoration:none;
}

#user {
width:25%;
margin:2px;
border-right:#eee solid 5px;
}
#user p {
display:block;
letter-spacing:1px;
padding:1px;
text-align:justify;
}
#user ul{
list-style:none;
width:100%;
padding:0px;
margin:0px;
}
#user li {
padding: 2px 2px 0px 0px;
margin: 0px;
}
#user li a{
color:#aaa;
text-transform:uppercase;
display: block;
border-left:5px solid;
padding-left:2px;
text-decoration:none;
font-weight:bold;
}
#user li a:hover{
background:#efefef;
color:#333;
text-decoration:none;
padding-left:4px;
}
#user li img {
vertical-align:middle;
padding:2px;
}
#content {
margin:0 auto;
background:url(http://i1114.photobucket.com/albums/k533/CaLinMu/Wrapper.png);
width:75%;
}
#content p {
display:block;
letter-spacing:1px;
padding:2px;
text-align:justify;
}

#footer {
margin:0 auto;
background:url(http://i1114.photobucket.com/albums/k533/CaLinMu/Wrapper.png);
text-align:center;
border-top:1px dotted #aaa;
border-bottom:1px inset #aaa;
position:inherit;
font-family: Arial, Tahoma, Verdana, sans-serif;
}
#footer a{
color:#343434;
padding:4px;
text-align: center;
text-transform:uppercase;
text-decoration:none;
font-weight:bold;
}
#footer a:hover{
color:#aaa;
text-decoration:none;
}
#footer p{
font-size:09px;
text-transform:uppercase;
text-align:center;
color:#4C3A7A;
font-weight:bold;
}

a {
color:#C9C9C9;
text-decoration:none;
font-weight:bold;
letter-spacing:1px;
}
a:hover {
color:#A87174;
}

#content img {
border:0px;
vertical-align:middle;
padding:2px;
}
#user img.left {
border:0px;
vertical-align:middle;
float:left;
padding:5px;
}
#user img.av{
text-align:center;
border:4px solid #eee;
backgroun:#eee;
float:left;
border-radius: 5px;
margin:5px;
}

input, select {
background:#000;
border: 1px solid #A5BDD1;
width:auto;
height:20px;
color:#22AAAA;
font-style:italic;
margin:5px;
}
textarea {
background:#000;
border-bottom: 1px solid #A5BDD1;
border-top: 1px solid #000;
border-left: 1px dotted #000;
width:100%;
height:50px;
color:#22AAAA;
font-style:italic;
border-right: 1px solid #000;
}
h1 {
line-height: normal;
padding:5px;
font-size:26px;
font-family: Baskerville, 'Goudy Old Style', Palatino, 'Book Antiqua', serif;
font-weight: bold;
color:#FFFFFF;
}
h1 span {
display:block;
font-size:10px;
text-transform:lowercase;
margin-left:10PX;
color:#000;
font-family: Arial, Tahoma, Verdana, sans-serif;
margin-top:-5px;
letter-spacing:2px;
}

td {
width:auto;
padding:10px;
}

strong, b {
color:#2A886E;
}
em, i {
font-weight:bold;
color:#A35B82;
}
u {
color:#4C3A7A;
font-weight:bold;
}

blockquote {
border-left:#22AAAA 5px solid;
padding-left:10px;
color:#22AAAA;
}

code {
color:#22AAAA;
font-style:italic;
}

a.onlinelist:hover
{
	background:#09f;
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}
.onlinelistt
{
	color: red;
	width: 20%;
	display: inline-block;
	margin-bottom: 5px;
	text-align: center;
}
.onlinelistj
{
	color: green;
	display: inline-block;
	width: 20%;
	text-align: center;
}
.onlinelistp
{
	color: blue;
	display: inline-block;
	width: 20%;
	text-align: center;

}

***Tequila*** · #3 09-29-2011, 06:52 PM

Try giving the UL for the menu a name like #dropdown and then continue it through the li's as well.

If that doesn't work please let me know. It may be a cross css problem.

Linkin-Dreamer · #4 09-30-2011, 04:24 AM

I think it is a cross CSS problem. You know how the spookywood has a fixed header, menu and sidebar? The drop-down menu scrolls down instead of stays fixed

***Tequila*** · #5 09-30-2011, 06:39 PM

Try adding

PHP Code:


			
position:fixed;

to the css for the menu in the spookywood css. :3

What's New?

What's Hot?

What's Popular?