Forums

  • # December 29, 2009 at 7:13 pm

    I have a lot of questions really but I am only going to cash in my ticket for one question. Before I even ask my question here is the website I am working with…

    http://www.soundclick.com/bumbeats

    I have a VIP account that is supposed to allow me to control my page layout. One thing I noticed is that when I visit my page from a mac using Safari it not only shows the background opacity on my page but I can also see the option for opacity in the "color controls" under my page layout tab to make the backgrounds opaque.

    However when I visit my page from a different pc on IE I notice that it does not show any opacity at all and in fact when I go to edit the page to see what is going on it does not even show me the option for opacity?

    Anyways what I would like to do is have the background be Opaque no matter what browser someone is viewing my page from. If I could get some help it would be gratly appreciated. Here is the complete code for my page below. I tried to fix this on my own for a while but I do not know where to put the code. I am trying to make the black backgrounds on my page Opaque so you can see the picture in the background…again the page is http://www.soundclick.com/bumbeats…thanks agead of time for any help….I am more interested in learning about CSS then I am a free handout…so an explanation of what gets changed would be cool to.

    Code:
    /********* SoundClick CSS Template (based on custom version Sat, Dec 26 2009) ***********/

    /* general */
    body {background:#333333 url(http://i707.photobucket.com/albums/ww75/bumbeats/4010539646_a615e8f7e2_o.jpg) fixed center; margin:0px;}
    body,div,tr,td,select,textarea,input,option {font-family:Tahoma,Geneva; font-size:13px;}
    a, a:link, a:visited {color:#ececec; text-decoration:none;}
    a:hover {color:#ff0000; text-decoration:underline;}
    .pageFooter {clear:both; color:gray; padding:30px 0px 50px 20px;}
    .infoBox {width:650px; margin:50px auto; background:white; color:black; border:silver solid 1px; padding:30px; font-size:14px;} /* hardly used, its for error messages to user */
    .infoBox .quotes {margin:20px; border:#222222 dashed 1px; font-style:italic; padding:10px; background:#000000;}

    /* main containers */
    .mainTable {; color:#999999; width:990px; margin-left:auto; margin-right:auto; text-align:left;}
    .mainContent {background:url(/images/siteNav/transbgblocks/black/bg_20.png); color:#999999; width:683px; float:left; overflow:hidden; margin:10px 0px 20px 5px;} /* IE6 doesnt support our preferred overflow:visible :( */

    }
    /* left navigation */
    .navigation {background:url(/images/siteNav/transbgblocks/black/bg_20.png); color:#666666; width:300px; float:left; overflow:hidden; margin:10px 0px 20px 0px;}
    .navigation a:link, .navigation a:visited {color:#999999;}
    .navigation a:hover {color:#ffffff;}
    .navigationDivider {height:6px; line-height:6px; border-bottom:#232323 dashed 1px; margin-bottom:6px;}

    /* general elements */
    .headline {background:#000000; color:#cccccc; font-weight:bold; border-bottom:#222222 dashed 1px; border-top:#222222 solid 1px; padding:3px 0px 3px 6px;}
    .headlineBig {font-size:22px; font-weight:normal;}
    .headlineSuppl {float:right; margin:10px 5px 0px 0px; color:#666666; font-size:11px; font-weight:normal;} /* for text/links on the right side of main headline (e.g. song count on main page) */
    .headlineSuppl a:link, .headlineSuppl a:visited {color:#666666; text-decoration:none;}
    .headlineSuppl a:hover {color:#ff0000; text-decoration:underline;}
    .pageturner {background:#000000; color:#cccccc; border:#222222 solid 1px; text-align:right; padding:10px; font-size:13px; font-weight:normal;} /* pages menu (previous, next..), e.g. on music page, message board */
    .pageturner .nonactive {color:#666666;}
    .pageturner a:link, .pageturner a:visited {color:#cccccc; text-decoration:none;}
    .pageturner a:hover {color:#ff0000; text-decoration:underline;}
    .listedPicsBox {border:#222222 solid 1px; width:114px; height:160px; overflow:hidden; padding:2px 1px 4px 1px; margin:0px 4px 10px 4px; float:left; font-size:11px; text-align:center;}
    .listedPics {width:110px; height:125px; background-position: center center; background-repeat: no-repeat; margin:2px 0px 4px 0px; overflow:hidden}
    .breaker {height:1px; line-height:1px; clear:both}

    /* general color and font assets */
    .color_supplemental {color:#666666;} /* used e.g. for song pages comments count */
    .alternateBG0 {background:none;} /* used as background colors for comments */
    .alternateBG1 {background:none;} /* alternate color */

    /* main page (the default entry page) */
    .mainContent .contHeadline {clear:left; font-size:15px; color:#cccccc; padding:12px 0px 2px 20px;} /* interview questions */
    .mainContent .contText {clear:left; padding-left:15px;}
    .mainContent .contInterview {clear:left; padding-left:35px;}
    .mainContent .newsBox {clear:both; background:#000000; color:#cccccc; border:#222222 solid 2px; margin:0px 20px 20px 20px; padding:20px;}

    /* main page: video box (different from video page) */
    .videoBox_mainPage {padding:5px; margin:0px 100px 20px 100px;}
    .videoBox_mainPage .video {padding:5px; margin-bottom:10px;}
    .videoBox_mainPage .title {font-size:15px; text-align:center; margin-bottom:3px;}
    .videoBox_mainPage .shareLinks {float:right; padding:2px; border-bottom:#222222 dashed 1px;}
    .videoBox_mainPage .labels {color:#666666; width:100px; padding-right:20px; text-align:right; float:left;}
    .videoBox_mainPage .info {padding-left:120px;}
    .videoBox_mainPage a:link, .videoBox_mainPage a:visited {font-size:12px; font-weight:normal; text-decoration:none;}
    .videoBox_mainPage a:hover {text-decoration:underline;}

    /* main page: upcoming shows */
    .liveshowsBox {background:#cccccc; color:#000000; width:300px; margin:15px 2px 15px 10px; float:right; clear:right;}
    .liveshowsItems {padding:4px 0px 0px 0px; font-size:11px; clear:both;}
    .liveshowsBox a:link, .liveshowsBox a:visited {color:#000000; text-decoration:none;}
    .liveshowsBox a:hover {color:#666666; text-decoration:underline; cursor:pointer;}

    /* main page: standard song box on artist page (only this song box or the embedded player is used. Never both together) */
    .playerBox {float:left; clear:left; padding-left:20px; margin:15px 0px 3px 0px;}
    .playerBox .playerHead {background:#000000; color:#cccccc; border-top:#222222 solid 1px; border-bottom:#222222 solid 1px; text-align:right; font-size:12px; padding:3px 5px 3px 3px;}
    .playerBox .playerHead a:link,.playerBox .playerHead a:visited {color:#666666; text-decoration:underline;}
    .playerBox .playerHead a:hover {color:#ffffff; text-decoration:underline;}
    .playerBox .songBox {background:#cccccc; border-bottom:#222222 solid 1px; width:330px; padding:3px 0px 0px 1px; overflow:auto;}
    .playerBox .songBox .singleSong {color:#000000; font-size:12px; padding:1px;}
    .playerBox .songBox .singleSong:hover {background:#000000; color:#cccccc; cursor:pointer;}

    /* main page: VIP embedded player (only this embedded player or the standard song box is used. Never both together) */
    .embeddedPlayer {margin:20px auto; width:620px;}

    /* main page: tabbed content headers (fans,stations) */
    .tabbedCont_header li a:link, .tabbedCont_header li a:visited {background:#000000; color:#666666; text-decoration:none; margin:0px 20px 0px 0px; padding:3px 6px 3px 6px; border:#666666 solid 1px; border-bottom:none; }
    .tabbedCont_header li a:hover {color:white;}
    .tabbedCont_header li.selected a:link, .tabbedCont_header li.selected a:visited {background:#111111; color:#999999; border:#111111 solid 1px; border-top:#999999 solid 1px; font-weight:bold;}

    /* main page: fans, stations (tabbed content) */
    .fansBox {padding:30px 20px 20px 20px; clear:both;}
    .fansBox a:link, .fansBox a:visited {}
    .fansBox a:hover {}
    .fancount {background:#111111; color:#666666; text-align:right; padding:3px 5px; margin-bottom:8px; font-size:11px; font-weight:normal; border-bottom:#232323 dashed 1px; border-top:#222222 solid 1px; }
    .fancount a:link, .fancount a:visited {color:#B8B8B8; text-decoration:none;}
    .fancount a:hover {color:#E6E6E6; text-decoration:none;}
    .fansBox_content {background:url(/images/siteNav/transbgblocks/black/bg_20.png) important; background:#111111;}
    .fansBoxLastLine {background:#111111; color:#666666; clear:both; text-align:right; padding:3px 5px; margin-top:8px; font-size:11px; font-weight:normal; border-bottom:#222222 solid 1px; border-top:#232323 dashed 1px;}
    .fansBoxLastLine a:link, .fansBoxLastLine a:visited {color:#B8B8B8; text-decoration:none;}
    .fansBoxLastLine a:hover {color:#E6E6E6; text-decoration:none;}
    .stationItem {clear:both; color:black; border-bottom:#222222 dashed 1px; padding:0px 1px 0px 1px;}
    .stationPicBox {float:left;}
    .stationPics {width:70px; height:70px; background-position:center center; background-repeat: no-repeat; margin:0px 0px 1px 0px; overflow:hidden}
    .stationButtonsBox {float:left; padding:2px 15px 0px 5px; height:60px;}
    .stationsText {color:#999999; height:80px; overflow:hidden;}
    .stationlink a:link, .stationlink a:visited {color:#999999; font-size:15px; text-decoration:none;}
    .stationlink a:hover {color:#ff0000; text-decoration:underline;}

    /* music page */
    .songsBox {border-bottom:#222222 dashed 1px; width:510px; float:left; padding-bottom:2px; margin-bottom:10px;}
    .songsBox a:link, .songsBox a:visited {text-decoration:none;}
    .songsBox a:hover {text-decoration:underline;}
    a.songtitle:link, a.songtitle:visited {color:#999999; text-decoration:none; font-size:15px; font-weight:bold;}
    a.songtitle:hover {color:#ff0000; text-decoration:underline;}
    .songsBox .actionlinks {font-size:13px;} /* the links for full song info, add to station, rate this song… */
    .songsBox .topSong {color:#666666; float:left; text-align:left; font-size:12px;}

    /* comments page */
    .commentsWelcome {background:#000000; color:#cccccc; margin:0px 20px 20px 20px; padding:20px; border:#222222 solid 1px;}
    .commentsBox {border-bottom:#222222 dashed 1px; padding-top:5px;}
    .commentsBox a:link, .commentsBox a:visited {text-decoration:none;}
    .commentsBox a:hover {text-decoration:underline;}
    .commentsBox .songComment {border-bottom:#222222 dashed 1px; font-size:11px; padding:1px 3px; margin-bottom:5px;}
    .commentsBox .postdate {color:#666666; font-size:12px; font-weight:normal; text-align:right; margin:0px 5px 10px 0px;}
    .commentsBox .postdate a:link, .commentsBox .postdate a:visited {text-decoration:none;} /* for delete/edit links */
    .commentsBox .postdate a:hover {text-decoration:underline;}
    .commentsBox .comment {font-size:13px; padding:0px 5px 0px 140px;}
    .commentsBox .bandSignature {border-top:#222222 dashed 1px; color:#666666; width:310px; margin-top:15px; line-height:20px;}
    .commentsBox .ratingsBox {float:right; width:220px; border-left:#222222 dashed 1px; margin-bottom:10px;}
    .ratingsBox .label {width:115px; text-align:right; float:left; padding-right:20px;} /* also used for .commentsPostBox .ratingsBox */
    .commentsPostBox {padding:10px; margin:20px 0px; background:#FFCC99; color:#000000; border-top:black solid 2px; border-bottom:black solid 1px;}
    .commentsPostBox .ratingsBox {background:#ECECEC; color:#000000; clear:both; padding:7px 0px; margin:0px 250px 20px 30px;}

    /* video page */
    .videoBox {background:black; color:#E0E0E0; padding:5px; line-height:22px;}
    .videoBox .video {padding:20px; margin-bottom:10px;}
    .videoBox .title {text-align:center; background:#121212; color:#F3F3F3; font-size:16px; padding:1px;}
    .videoBox .labels {color:#666666; width:200px; padding-right:20px; text-align:right; float:left;}
    .videoBox .info {float:left; width:440px;}
    .videoBox a:link, .videoBox a:visited {color:#0099CC; text-decoration:none; font-size:11px;}
    .videoBox a:hover {color:red; text-decoration:underline;}
    .videoListBox {border-top:#222222 dashed 1px;}

    /* photo pages */
    .photopage {background:black;}
    .selectedPhoto_box {text-align:center;}
    .selectedPhoto_box .selPhoto_title {background:#111111; color:#cccccc; border-bottom:#666666 solid 1px; font-size:15px; padding:4px;}
    .photolist {padding:10px 0px 0px 30px;}
    .photolist .photobox {background:none; float:left; width:118px; height:180px; margin:5px 0px 20px 10px; padding:5px 0px 10px 0px; overflow:hidden; cursor:pointer; text-align:center;}
    .photobox .photo {height:150px; width:118px; overflow:hidden;}
    .photobox .photoComment {color:#444444; font-size:11px;}
    .photolist .photobox_on {background:#222222; float:left; width:118px; height:180px; margin:5px 0px 20px 10px; padding:5px 0px 10px 0px; overflow:hidden; cursor:pointer; text-align:center;}
    .photobox_on .photo {height:150px; width:118px; overflow:hidden;}
    .photobox_on .photoComment {color:#999999; font-size:11px;}

    /* reviews page */
    .reviewsBox {padding:10px 30px; border-bottom:#222222 dashed 1px;}
    .reviewsBox .rev_headline {color:#cccccc; font-size:15px; font-weight:bold;}
    .reviewsBox .rev_text {padding:5px 5px 5px 30px; font-size:13px;}
    .reviewsBox .rev_source {text-align:right; font-size:12px; color:#666666;}

    /* licensing page */
    .licenseSummary {margin:0px 20px 20px 20px; padding:20px; background:#000000; color:#cccccc; border:#222222 solid 2px;}
    .licenses {margin-top:70px;}
    .licenses .headline {font-size:14px;}
    .lic_tableSongs {border:none;}
    .lic_tableSongs .columnHeaders td {border-bottom:#222222 solid 1px; font-weight:bold; font-size:11px;}
    .lic_tableSongs tr td {border-bottom:#222222 dashed 1px; padding:5px 0px;}

    /* widgets page */
    .widgetMargin { padding:8px 0px 8px 35px;}
    .widgetSpacer {width:100; height:15px; clear:both;}

    /* tag cloud */
    .tagCloud {padding:10px;}
    .tagCloud .cloudItem {float:left; padding:2px; white-space:nowrap; margin:0 6px 0 0;}
    .tagCloud .cloudItem:hover {background:#005782; color:white; cursor:pointer;}
    .tagCloud .cloudS10 {font-size:10px; color:#aaaaaa;}
    .tagCloud .cloudS20 {font-size:11px; color:#aaaaaa;}
    .tagCloud .cloudS30 {font-size:11px; color:#999999;}
    .tagCloud .cloudS40 {font-size:12px; color:#999999;}
    .tagCloud .cloudS50 {font-size:14px; color:#666666;}
    .tagCloud .cloudS60 {font-size:16px; color:#666666;}
    .tagCloud .cloudS70 {font-size:18px; color:#333333;}
    .tagCloud .cloudS80 {font-size:22px; color:#333333;}
    .tagCloud .cloudS90 {font-size:28px; color:#111111; }
    .tagCloud .cloudS100 {font-size:36px; color:#111111;}
    .tagCloudMore {padding:6px 0 0 0; margin:0 10px; text-align:center; border-top:#ccc solid 1px; font-size:11px;}
    .tagCloudMore a, .tagCloudMore a:link, .tagCloudMore a:visited {color:#999; text-decoration:none;}
    .tagCloudMore a:hover {color:red; text-decoration:underline; cursor:pointer;}

    # May 4, 2010 at 9:38 am

    Hi, sorry I cant answer your question :D But I was wondering, can you change your background on a standard band account?
    I know you can’t add certain features I just want to get rid of the terrible white background but I don’t see an option to do it on my band account.
    I can do it on my personal account so what gives?

    # January 11, 2017 at 9:23 pm

    I friend of mine Design Web Pages in CSS.He works in Florida and you can have any kind of work related to CSS from him.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

icon-closeicon-emailicon-linkicon-logo-staricon-menuicon-searchicon-staricon-tag