3 replies [Last post]
Hadii
Hadii's picture
Offline
newbie
Last seen: 11 years 13 weeks ago
Timezone: GMT+10
Joined: 2010-06-19
Posts: 2
Points: 3

Hey guys, ive got a problem in my CSS, since i made the change to opacity for my background images, when you mouse over the options in the menu, they dont go bold anymore (in IE, chrome, FF working 100% fine) im not sure what the problem is, so heres the whole CSS file, if someone could help me itd be great, and sorry again for the large lump of code.

@charset "utf-8";
/* CSS Document */
 
body {
	margin: 0;	
	background: url(bg.png);
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
}
a {
	font-weight: bold;
	text-decoration: none;
	color: #5AA4C7;
}
img {
	border: 0;
}
div#container {
	width: 1005px;
	margin: auto;
}
div#banner {
	width: 1005px;
	height: 132px;
	background: url(banner.png);
}
div#draggable_toggle {
	width: 23px;
	height: 21px;
	background: url(draggable_toggle.png);
	position: relative;
	float: right;
	margin-right: 3px;
	cursor: pointer;
}
div#navigation {
	width: 965px;
	height: 35px;
	background: url(navbar.png);
	padding-left: 20px;
	padding-right: 20px;
}
div#navigation ul, div#navigation ul li {
	padding: 0;
	margin: 0;
	list-style-type: none;
	height: 42px;
}
div#navigation ul li {
	margin-left: 15px;
	margin-right: 15px;
	float: left;
	background-position: top;
	outline: none;
	cursor: pointer;
	position: relative;
}
div#navigation ul li div.sub {
	display: none;
	position: absolute;
	top: 25px;
	z-index: 9999999;
}
div#navigation div.top {
	width: 215px;
	height: 8px;
	background: url(subnav_top.png);
}
div#navigation div.mid {
	width: 215px;
	background: url(subnav_mid.png);
        /* for IE */     filter:alpha(opacity=82);       /* CSS3 sta\ndard */
        opacity:0.82;
}
div#navigation div.mid a {
   color: #FFFFFF;
	font-weight: normal;
	display: block;
	padding: 3px;
	margin-left: 8px;
	margin-right: 8px;
	outline: none;
}
div#navigation div.mid a:hover {
	background-color: #000000;
	font-weight: bold;
}
div#navigation div.mid a.two {
	background-color: #000000;
}
div#navigation div.mid a.two:hover {
	//background-color: #DCEAFA;   font-weight: bold;
 
}
div#navigation ul li div.sub div.bot {
	width: 215px;
        height: 8px;
	background: url(subnav_bot.png);
        /* for IE */
        filter:alpha(opacity=82);
        /* CSS3 standard */
        opacity:0.82;
}
div#navigation div#bth_items {
	float: right;
}
div#navigation div#bth_items div#friends {
	width: 19px;
	height: 18px;
	background: url(bth/friends.png);
	margin-top: 9px;
	cursor: pointer;
	float: left;
	margin-right: 10px;
}
div#navigation div#bth_items div#notifications {
	width: 19px;
	height: 18px;
	background: url(bth/notification.gif);
	margin-top: 9px;
	cursor: pointer;
	float: left;
}
div#navigation div#bth_items div#friends_num, div#navigation div#bth_items div#notifications_num {
	width: 17px;
	height: 18px;
	background-image: url(bth/notification_num.png);
	position: absolute;
	margin-top: -5px;
	margin-left: 9px;
	text-align: center;
	font-weight: bold;
	color: #AC2D2D;
}
 
div.blue_bg {
	width: 1005px;
	background: url(blue_bg.png);
	clear: both;
	overflow: hidden;
}
div#blue_header_bot {
	width: 1005px;
	height: 3px;
	background: url(blue_bg_bot.png);
}
div#radio_stats {
	width: 406px;
	height: 148px;
	background: url(radio_stats.png);
	float: left;
	margin-left: 9px;
}
div#dj_says {
 	width: 377px;
	height: 18px;
	background: url(dj_says.png);
	margin-left: 10px;
	margin-top: 10px;
	color: #236178;
	padding: 4px;
}
div#stats_content {
	width: 377px;
	margin-left: 15px;
	margin-top: 10px;
	color: #FFF;
}
a#stats_refresh {
	width: 82px;
	height: 86px;
	background: url(stats_refresh.png);
	float: right;
	outline: none;
	margin-left: 5px;
}
div#stats_offline {
	width: 118px;
	height: 24px;
	background: url(stats_offline.png) no-repeat bottom;
	margin-left: 100px;
	padding-top: 20px;
}
div#rotating_banners {
	width: 342px;
	height: 144px;
	background: url(advertisement.png);
	float: left;
	margin-left: 7px;
}
a.advertisement {
	width: 342px;
	height: 144px;
	position: absolute;
	background-repeat: no-repeat;
	outline: none;
}
 
div#bth {
	width: 229px;
	height: 144px;
	background: url();
	float: left;
	margin-left: 4px;
	color: #937500;
}
div#bth a {
	color: #937500;
}
div#container_two_top {
	width: 1005px;
	height: 5px;
	background: url(content_bg_top.png);
}
div#container_two {
	width: 1005px;
	background: url(content_bg.png);
	clear: both;
	overflow: hidden;
}
div#container_two_bot {
	width: 1005px;
	height: 5px;
	background: url(content_bg_bottom.png);
}
div#left_content {
	width: 217px;
	margin-left: 12px;
	margin-right: 9px;
	margin-top: 8px;
	margin-bottom: 1px;
	float: left;
	min-height: 400px;
}
div#middle_content {
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 8px;
	margin-bottom: 8px;
	float: left;
	width: 509px;
	color: #999;
}
div#right_content {
	width: 217px;
	margin-left: 9px;
	margin-right: 12px;
	margin-top: 8px;
	margin-bottom: 1px;
	float: left;
	min-height: 400px;
}
div#footer {
	width: 1005px;
	height: 114px;
	background: url(footer_bg.png);
}
div.box_container {
	width: 217px;
	margin-bottom: 7px;;
}
div.box_header {
	width: 217px;
	height: 26px;
}
div.radio_player {
	background: url(headers/radio_player.png);	
}
div.latest_news {
	background: url(headers/latest_news.png);	
}
div.dj_of_the_week {
	background: url(headers/dj_of_the_week.png);	
}
div.quick_request {
	background: url(headers/quick_request.png);	
}
div.latest_events {
	background: url(headers/latest_events.png);	
}
div.box_content {
	width: 201px;
	background: url(box_content.png);
	padding-top: 5px;
	padding-left: 8px;
	padding-right: 8px;
	padding-bottom: 5px;
	color: #999;
	clear: both;
	overflow: hidden;
}
div.box_footer {
	width: 217px;
	height: 8px;
	background: url(box_footer.png);
}
div.draggable {
	cursor: move;	
}
div#advertisement_right {
	width: 226px;
	height: 143px;
	background: url(advertisement_right.png);
	margin-left: -9px;
	margin-bottom: 7px;;	
}
div#users_online {
	width: 209px;
	height: 27px;
	background: url(users_online.png);
	color: #999;
	text-align: center;
	padding-top: 9px;
	padding-left: 4px;
	padding-right: 4px;
	margin-bottom: 7px;;
}
span.strong {
	font-weight: bold;	
}
div#disclaimer {
	width: 428px;
	margin-top: 13px;
	margin-left: 13px;
	margin-bottom: 13px;
}
div#disclaimer_top {
	width: 428px;
	height: 4px;
	background: url(disclaimer_top.png);
}
div#disclaimer_bg {
	width: 412px;
	background: url(disclaimer_bg.png);
	padding: 8px;
	color: #599CF8;
}
div#disclaimer_bot {
	width: 428px;
	height: 4px;
	background: url(disclaimer_bottom.png);
}
div#bth div.input {
	width: 199px;
	height: 23px;
	margin: auto;
	background: url(forms/bth_input.gif);
}
div#bth div.error {
	width: 199px;
	height: 23px;
	margin: auto;
	background: url(forms/bth_input_red.png);
}
div#bth div#username {
	width: 199px;
	height: 23px;
	margin: auto;
	background: url(forms/username.gif);
}
div#bth div#password {
	width: 199px;
	height: 23px;
	margin: auto;
	background: url(forms/password.gif);
}
div#bth input {
	border: none;
	background: none;
	width: 189px;
	margin-left: 5px;
	margin-right: 50px;
	margin-top: 5px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #B59200;
	padding: 0;
	border: 0;
}
div#bth div.error input {
	color: #B52504;
}
div#bth div#buttons {
	width: 199px;
	margin: auto;
	margin-top: 8px;
}
div#bth input#submit {
	width: 91px;
	height: 29px;
	background: url(forms/login.gif);
	outline: none;
	float: right;
	margin: 0;
}
div#bth input#register {
	width: 91px;
	height: 29px;
	background: url(forms/register.gif);
	outline: none;
	float: left;
	margin: 0;
}
div#play_stop {
	height: 21px;
	width: 29px;
	background: url(radio/play_stop.png);
	float: left;
	cursor: pointer;	
}
 
div#refresh_player {
	height: 17px;
	width: 17px;
	background: url(radio/refresh.png);
	float: left;
	margin-top: 2px;
	margin-left: 10px;
	cursor: pointer;	
}
div#volume_container {
	width: 119px;
	height: 13px;
	background: url(radio/volume.png);
	float: left;
	margin-left: 10px;
	margin-top: 4px;	
}
div#volume_handle {
	width: 16px;
	height: 13px;
	background: url(radio/volume_handle.png) center;
	position: relative;
	cursor: move;	
}
div.message_green, div.message_red {
	width: auto;
	border: 1px solid;
	border-bottom-width: 2px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;	
	margin-top: 3px;
	margin-bottom: 3px;
	padding: 4px;
	text-align: center;
}
div.message_green {
	background-color: #d9ffcf;
	border-color: #ade5a3;
	color: #1b801b;
}
div.message_red {
	background-color: #ffcfcf;
	border-color: #e5a3a3;
	color: #801b1b;
}
div#customize_myhabbcrazy {
	width: 217px;
	height: 29px;
	background: url(customize_myhabbcrazy.png);
	cursor: pointer;
	margin-top: -8px;
	margin-bottom: 8px;
}
input[type=text], input[type=password], input[type=select], textarea, select {
	border: 1px #e0e0e0 solid;
	border-bottom-width: 2px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 5px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #999;
}
input[type=text]:focus, input[type=password]:focus, input[type=select]:focus, textarea:focus, select:focus {
	border-color: #ccc;
	background-color: #fafafa;
}
input[type=file] {
	font-size: 11px;
	color: #999;
}
input[type=submit], input[type=button], #colorbox {
	border: 1px #ddd solid;
	border-bottom-width: 2px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 5px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #888;
	background: #f0f0f0;
	cursor: pointer;
	padding: 3px;
	font-weight: bold;
	float: right;
}
input[type=submit]:hover, input[type=button]:hover {
	background-color: #e6e6e6;
	border-color: #d6d6d6;
}
/* Form Submit */
 
a.button {
	margin: 0 0 5px 10px;
	display: block;
	float: right;
	height: 28px;
	position: relative;
	text-decoration: none;
	cursor: pointer;
	overflow: hidden;
    white-space:nowrap;
}
 
a.button.disabled-button, a.button:disabled {
	cursor: default;
	-moz-opacity: .5;
	opacity: .50;
	filter: alpha(opacity=50);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
 
/* hide this from IE6 */
html > body a.button.fill, html > body a.button.fill b {
	display: block;
	float: none;
}
 
a.button b {
	float: left;
	padding: 9px 17px 4px 20px;
	font-size: 9px;
	height: 16px;
	margin-right: 4px;
	background: transparent url(forms/button.png) no-repeat -4px 0;
	color: #FFF !important;
	font-weight: bold;
	text-align: center;
	display: inline;
	font-family: Verdana, Geneva, sans-serif;
	text-transform: uppercase;
}
a.button b img {
	border: 0;
}
a.button i {
	position: absolute;
	right: 0;
	top: 0;
	width: 4px;
	height: 28px;
	background: transparent url(forms/button.png) no-repeat 0px 0px;
}
a.button:hover { text-decoration: none; }
a.button:hover b { background-position: -4px -28px; }
a.button:hover i { background-position: 0px -28px; }
 
/* Events Calender */
div.calenderItem {
	width: 25px;
	height: 19px;
	float: left;
	text-align: center;
	margin-right: 2px;
	color: #727272;
	font-weight: bold;
	padding-top: 6px;
	margin-bottom: 2px;
	background: #E1E1E1;
}
div.event {
	background: #C4C4C4;
}
div.last {
	margin-right: 0;	
}
div.today {
	width: 27px;
	height: 18px;
	position: absolute;
	background: url(calender_today.png);
	margin-top: -5px;
	margin-left: -1px;
	padding-top: 5px;
}
span#calender_title, span#calender_title a {
	font-size: 20px;
	color:#727272;
	font-weight: bold;
	text-transform: uppercase;	
}
.help {
	padding: 5px;
	height: 1x;
	position: relative;
	left: -9px;
	border: 1px #ccc solid;
	border-bottom-width: 2px;
	-moz-border-radius-topright: 3px;
	-webkit-border-radius-topright: 3px;
	border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;
	-webkit-border-radius-bottomright: 3px;
	border-radius-bottomright: 3px;
}
.help.grey {
	background-color: #eee;
}
.help.good {
	background-color: #d9ffcf;
	border-color: #ade5a3;
	color: #1b801b;
}
.help.bad {
	background-color: #ffcfcf;
	border-color: #e5a3a3;
	color: #801b1b;
}
td.label {
	text-align: right;
	font-weight: bold;
}
 
td.field {
	width: 150px;
	text-align: right;
}
username {
	font-size: 20px;	
	font-weight: 900;
}
div.badge_holder {
	width: 50px;
	height: 50px;
	background-color: #f0f0f0;
	float: left;
	background-repeat: no-repeat;
	background-position: center center;
	margin: 2px;
	border: 1px solid #f0f0f0;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
div.pagination {
	padding: 3px;
	text-align: right;
	width: auto;
}
div.pagination a {
	padding: 2px;
	border: 1px solid #FFF;
	border-bottom: 2px solid #FFF;
	text-decoration: none; /* no underline */
	border-left: none;
	border-right: none;	
}
div.pagination a:hover, div.pagination a:active {
	color: #FFF;
	background-color: #5AA4C7;
	border-bottom: 2px solid #5AA4C7;
	border-left: none;
	border-right: none;	
}
div.pagination a.current {
	padding: 2px;
	border: 1px solid #FFF;
	border-bottom: 2px solid #5AA4C7;
	font-weight: bold;
	color: #5AA4C7;
	border-left: none;
	border-right: none;
}
div.pagination a.current:hover {
	color: #FFF;
}
div.bth_user {
	width: 100px;
	min-height: 100px;
	padding: 5px;
	float: left;
	text-align: center;
	background-color: #f0f0f0;
	border: 1px solid #f0f0f0;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 5px;
}
ul.app {
	list-style: none;
	margin-left: 0;
	padding: 0;
}
ul.app li {
	background: url(star_gold.gif) no-repeat center left; 
	padding-left: 20px;
	padding-top: 4px;
	min-height: 13px;
	margin-left: 0;
	//margin-bottom: 3px;
}
div#comments_container div.comment {
	border: 1px #e0e0e0 solid;
	border-bottom-width: 2px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 5px;
	color: #999;
	width: auto;
	margin-bottom: 10px;
}
.rating-unit-rating {
	list-style:none;
	margin: 0px;
	padding:0px;
	height: 30px;
	position: relative;
	background: url(starrating.gif) top left repeat-x;
}
.rating-unit-rating li{
    text-indent: -90000px;
	padding:0px;
	margin:0px;
	float: left;
}
.rating-unit-rating li a {
	outline: none;
	display:block;
	width:30px;
	height: 30px;
	text-decoration: none;
	text-indent: -9000px;
	z-index: 20;
	position: absolute;
	padding: 0px;
}
.rating-unit-rating li a:hover{
	background: url(starrating.gif) left center;
	z-index: 10;
	left: 0px;
}
.rating-unit-rating a.r1-unit{left: 0px;}
.rating-unit-rating a.r1-unit:hover{width:30px;}
.rating-unit-rating a.r2-unit{left:30px;}
.rating-unit-rating a.r2-unit:hover{width: 60px;}
.rating-unit-rating a.r3-unit{left: 60px;}
.rating-unit-rating a.r3-unit:hover{width: 90px;}
.rating-unit-rating a.r4-unit{left: 90px;}
.rating-unit-rating a.r4-unit:hover{width: 120px;}
.rating-unit-rating a.r5-unit{left: 120px;}
.rating-unit-rating a.r5-unit:hover{width: 150px;}
 
.rating-unit-rating li.rating-current-rating {
	background: url(starrating.gif) left bottom;
	position: absolute;
	height: 30px;
	display: block;
	text-indent: -9000px;
	z-index: 1;
}
.rating-average {
    width:160px;
    margin:auto;
    text-align: center;
}
.rating-unit-rating{
    text-align: left;
    width:150px;
    margin: 0 auto;
}
.rating-stars{
    margin-top:5px;
    margin-bottom:5px;
    text-align: center;
}
.curved_item {
	background-color: #f0f0f0;
	border: 1px solid #f0f0f0;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.curved_item a {
	color: #999;
}
ul.bbcode_toolbar {
    list-style:none;
    margin:0;
    padding:0;
    margin-bottom:2px;
    text-align: left;    
}
 
ul.bbcode_toolbar li.control-button {
    float:left;
    list-style:none;
    margin:0;
    padding:0;
}
 
ul.bbcode_toolbar li.control-button a {
	width:19px;
	height:18px;
	float:left;
	display:block;
	background-image:url("bth/bbcode.png");
	margin:1px !important;
	margin: 0 1px 0 0;
}
 
ul.bbcode_toolbar li.control-button span {
    display:none;
}
 
#bbcode_bold_button { background-position: 0 0; }
#bbcode_italics_button { background-position: 0 -53px; }
#bbcode_underline_button { background-position: 0 -105px; }
#bbcode_quote_button { background-position: 0 -158px; }
#bbcode_smallsize_button { background-position: 0 -263px; }
#bbcode_largesize_button { background-position: 0 -210px; }
#bbcode_code_button { background-position: 0 -315px; }
#bbcode_link_button { background-position: 0 -368px; }
#bbcode_youtube_button { background-position: 0 -421px; }
 
ul.bbcode_toolbar select {
    margin-left:3px;
}
 
.bbcode-quote {
	background-color: #F5F5F5;
	border: 1px solid #D8D8D8;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 3px 3px 10px;
	padding: 5px;
}
 
.bbcode-enabled {
	clear: both;
}
/* Styles for ColorPicker popUp */
 
#colorpicker {
  position: absolute;
  width: 145px;
  height: 145px;
  overflow: hidden;
  background-color: #F5F5F5;
  border: 1px solid #D8D8D8;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  z-index: 1000;
}
 
#colorpicker-hue-container {
    position: absolute; 
    top: 4px;
    left: 120px; 
    width: 18px;
    height: 110px; 
}
 
#colorpicker-hue-bg-img {
    width: 100%; 
    height: 100%; 
}
 
#colorpicker-hue-slider {
    position: absolute; 
    top: 0;
    left: 0; 
    width: 100%;
    height: 100%; 
}
 
#colorpicker-hue-thumb { 
    position: absolute; 
    top: 0;
    left: 0;
    width: 18px; 
    height: 18px; 
    z-index: 1009;
    cursor: default;
}
 
#colorpicker-bar {
  text-align: right;
  padding-right: 10px;
}
 
#colorpicker-close {
  cursor: pointer;
  color: blue;
  font-weight: bold;
}
 
#colorpicker-div {
  position: absolute; 
  top: 8px;
  left: 8px; 
  width: 100px;
  height: 100px; 
  border: 1px solid #666;
}
 
#colorpicker-bg,
#colorpicker-bg-overlay { 
  position: absolute; 
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1001;
  overflow: hidden;
}
#colorpicker-selector { 
  position: absolute; 
  top: 0px;
  left: 0px;
  width: 11px; 
  height: 11px; 
  z-index: 1009;
  margin-top: -6px;
  margin-left: -6px;
  cursor: default;
}
#colorpicker-selector img {
  position: absolute;
  left: 0;
  top: 0;
}
#colorpicker-footer {
  position: absolute; 
  top: 114px;
  left: 10px; 
  width: 127px;
}
#colorpicker-value {
  float: left;
}
#colorpicker-value-input {
  width: 40px;
}
#colorpicker-okbutton {
	border: 1px #ddd solid;
	border-bottom-width: 2px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 5px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #888;
	background: #f0f0f0;
	cursor: pointer;
	padding: 3px;
	font-weight: bold;
	float: right;
}
#colorpicker-okbutton:hover {
	background-color: #e6e6e6;
	border-color: #d6d6d6;
}

thanks in advance.

Deuce
Deuce's picture
Offline
Guru
Somewhere, USA
Last seen: 4 years 9 weeks ago
Somewhere, USA
Timezone: GMT-5
Joined: 2005-11-20
Posts: 4424
Points: 1843

Providing a link would make

Providing a link would make troubleshooting a whole lot easier.
if you can't do that, at least provide your HTML so we know what the CSS is referring to.

all ยป http://dictionary.reference.com/browse/all

Google isn't a bunch of guys reading and grading web sites, it's more like a bunch of monkeys sniffing food and putting the good bananas at the top. -Triumph

Hadii
Hadii's picture
Offline
newbie
Last seen: 11 years 13 weeks ago
Timezone: GMT+10
Joined: 2010-06-19
Posts: 2
Points: 3

heres the

heres the link

http://Habonic.net

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 30 weeks 6 days ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

Your page is riddled with

Your page is riddled with both HTML and CSS syntax errors. The first thing you must do is to fix them all. Then if the problem persists come on back and ask again. If you don't know how to do this, consult our "How to" forum.

Also, switch your doctype from transitional to STRICT.

HTML Errors here

CSS Errors Here

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.