CSS - Band On Right Hand Side

Hello All,

I'm not too savvy with CSS, so please pardon if this seems uber easy.

I have started to use Google AdSense on my web pages ( I wish I could show you an example on my website, but I am not allowed to post a URL on the forum), In Firefox, it shows the main content on the left hand side and the Ads on the right hand side in a columnar format, however, there is no word wrapping going on. In Internet Explorer, the AdSense shows at the top right and then below that my content starts.

Here is what I have in my HTML in a single TD Cell:

[div class="google120rightbanner"]

[script type="text/javascript"][!--
google_ad_client = "myAdSenseID";
google_alternate_ad_url = "(Alternate Adsense URL)";
google_ad_width = 120;
google_ad_height = 240;
google_ad_format = "120x240_as";
google_ad_type = "text";
google_ad_channel = "";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_text = "000000";
google_color_url = "008000";
//--]
[/script]
[script type="text/javascript"
src="(Javascript URL Location)"]
[/script]

[/div]

[!-- Show my main content --]

[div id="ContentPane" runat="server" style="padding-left:2px;"][/div]
[!-- End my main content --]

[div class="clear"][/div]


This is what I have in my CSS:

.google120rightbanner [
width: 122px;
margin: 15px 10px 5px 10px;
float: right; /*allows main content to wrap around the google ad */
/*note: after this we need to use the clear class to clear the float at end of container */
]

.clear [
clear: both;
]


NOTE: I have changed the brackets so I can display this message on the forums.

Does anyone have any idea what I am doing wrong here in getting the display I want using this CSS? Again, I'm not very savvy about this, so a good explanation would be helpful.

Thank you all very much!

Mark Gordon

I also am having this problem with the menu in IE6 - the right hand side of the menu dropdown, "Videos", is also showing up on the left hand side, slightly cut off. I know it's "Videos" because when I hover over Videos, the text on the left hand side ("os") also lights up. Is it possible that -999em is not far enough over? What could be the problem/how can I fix this?

A related problem, perhaps, is that the first below-menu item starts about 20px below where it should be. I'm new to CSS programming and I'm not too sure what's going on.

image showing what the issue is at kburke dot org slash menuleft.jpg - I don't have enough posts to link an image.

I really appreciate your help.

The menu's in a 980px wide container. Some of the site's still in tables but I'm working on changing that.

#nav, #nav ul {
padding: 0;
margin: 0;
list-style: none;
float:left;
width:89.091em;
list-style:none;
line-height:1;
background:#b6791e;
font:11px Verdana, sans-serif;
font-weight:bold;
padding:0;
margin:0 0 .5em 0;
}

#nav a {
display: block;
width: 11.1em;
w\idth: 10.1em;
color: #FFFFFF;
text-decoration: none;
padding: 0.75em 0.5em;
}

#nav a.daddy {

}

#nav li {
float: left;
padding: 0;
width: 11.1em;
position:relative;
}

#nav li ul {
position: absolute;
left: -999em;
height:auto;
width: 14.7em;
w\idth: 14.5em;
font-weight: bold;
margin: 0;
padding:0;
background:#FFFFFF;
color:#769841;
border: 0.1em solid #769841;
}

#nav li ul a:hover{
color:#ffff30;
background:#769841;
}

#nav li ul li a{
color:#769841;
}

#nav li li {
padding-right: 1em;
width: 14.5em;
w\idth:13.5em;
}

#nav li:hover ul {
left: auto;
}

#nav li a:hover, nav li.sfhover a:hover{
color:#FFFF30;
}

#nav li ul li a:hover {
color:#FFFF30;
}

#nav li:hover ul, #nav li.sfhover ul {
left: auto;
clear:both;
}

#nav li ul ul {
margin: -3.3em 0 0 5em;
}


#nav li:hover, #nav li.sfhover {
background: #769841;
}

#nav li a:hover, #nav li.sfhover a:hover{
color: #ffff30;
}

#nav li ul a{
color:#769841;
padding:.4em;
}

I am having problems making the comments and upcoming shows show up. I want the friends and shows to show up under the first group of divisions div 5 and 6 - And I want the comments where the friends are now. Also I can not get anything that I embed to show up. I know it is because of the code to make the myspace music player play at the very end. I need the myspace music player there but I also want to embed my podcast and snowcap music player. Please help me out. Thanks.


Click here to see page

Here is my code:

Code:

<style type="text/css">

body table {margin-top:-5000px;}
body td table, body div table {margin-top: 0;}
table, tr, td {background-color:transparent;}
body div table form{display:none;}
body table div form{display:block;}
div table td font {visibility:visible;}

a.navbar:active, a.navbar:visited, a.navbar:link { color:ffffff; }

a.navbar:hover {color:ff0000}

.navbar{display: inline;}

a:active, a:visited, a:link, a:hover{ color:79889B; }


.blacktext10, table, tr, td, li, p, div { color:79889B; }



{text}
div, font, input, textarea, td{font-family:arial narrow
!important;font-size:10pt !important;text- bold!
color:ffffff; !important;}

.comt td, .comt table{width:0px!important; height:0px!important; background-color:transparent!important; border:0px!important; _padding:2px!important;} .comt .comt td, .comt table, .comt td a img, .comt td td td a, .comt td b a, .comt td .redlink{visibility:visible;} .comt td td td b{top:0px; display:inline;} .comt .orangetext15, .rid{display:none;} .comt td b, .blacktext10 {display:block;} .comt table, .comt td b, .comt .btext, .redlink{position:relative; top:-9px;} .comt {z-index:7;}

body {
background-color:000000;
background-image:url();
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
scrollbar-face-color:000000;
scrollbar-3dlight-color:000000;
scrollbar-shadow-color:000000;
scrollbar-darkshadow-color:000000;
scrollbar-arrow-color:79889B;
scrollbar-track-color:000000;
}



.banner {
background-color: 000000;
background-image: url('(URL address blocked: See forum rules));
background-repeat: no-repeat;
background-attachment: scroll;
background-position: center;
position: absolute;
left: 50%;
margin-left: -486px;
top: 177px;
height: 137px;
width: 965px;
border: 0px;
overflow: auto;
z-index: 1;
}

.div1 {
background-color:000000; color:000000;
background-image:url((URL address blocked: See forum rules));
border:1px ridge; border-color:888888;
width:250px; height:1050px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-485px; margin-top:315px;
visibility:visible;}

.div2 {
background-color:000000; color:000000;
background-image:url((URL address blocked: See forum rules));
border:1px ridge; border-color:888888;
width:453px; height:350px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-230px; margin-top:315px;
visibility:visible;}




.div4 {
background-color:000000; color:000000;
background-image:url((URL address blocked: See forum rules));
border:0px ridge; border-color:888888;
width:448px; height:340px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%; padding: 4px;
margin-left:-228px; margin-top:1023px;
visibility:visible;}

.div3 {
background-color:000000; color:000000;
background-image:url((URL address blocked: See forum rules));
border:1px ridge; border-color:888888;
width:250px; height:1050px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:228px; margin-top:315px;
visibility:visible;}



.comt td, .comt table {
width:0px!important;
height:0px!important;
background-color:000000!important;
border:0px!important; _padding:2px!important;}

.comt .comt td, .comt table, .comt td a img,
.comt td td td a, .comt td b a, .comt td .redlink{visibility:visible;}

.comt td td td b{top:1375px; display:inline;}
.comt .orangetext15, .rid{display:none !important;}
.comt td b, .blacktext10 {display:block;}
.comt table, .comt td b, .comt .btext, .redlink { position:relative; top:-9px;}
.comt {z-index:7;} .orangetext15 { visibility:hidden;}

.comt {
position:absolute;
width:965px;
height:300px;
overflow:auto;
background-color:000000;
border: 1px solid gray;
top:1375px;
left:50%;
margin-left:-486px;
}

.blacktext10 {display:none;}

.comt { scrollbar-face-color:000000;
scrollbar-face-color:000000;
scrollbar-highlight-color:999999;
scrollbar-3dlight-color:000000;
scrollbar-shadow-color:006633;
scrollbar-darkshadow-color:000000;
scrollbar-arrow-color:00FF00;
scrollbar-track-color:000000;}

.comt td, .comt span { !important; font-family: !important; color:FF0000 !important; }
.comt a {color:FF0000 !important; !important; font-family:Majandra GD !important; text-decoration:none !important;}
.comt a:hover {color:FFff00 !important; !important; font-family:Majandra GD !important;}
a img {border:0px !important;}
</style>

<div class="banner">
</div>


<div class="div1"><center><br><br><font color="yellow"><b>Booking Information:<br>Critical Mass Music<br>J Barre<br>(404) 644-4742</b><br></font><center><a href="mailto:ebrowne77@gmail.com"><font color="yellow"><b>ebrowne77@gmail.com</b></font></a></center><br><br>
<a href=(URL address blocked: See forum rules)=invite.addfriend_verify&friendID=110852663>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>

<br>
<a href=(URL address blocked: See forum rules)=user&Mytoken=4DD43AA2-63F5-4D5E-B503AFA03396064621867986>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>


<br>
<a href=(URL address blocked: See forum rules)=user.viewPicture&friendID=110852663>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>



<BR>
<a href=(URL address blocked: See forum rules)=mail.message&friendID=110852663>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>

<BR>
<a href=(URL address blocked: See forum rules)=user.viewfriends&friendID=110852663>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a><br>


<a href=(URL address blocked: See forum rules)=bandprofile.listAllShows&friendid=110852663&n=J+Barre>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a><br>




<a href=(URL address blocked: See forum rules)=user.addToFavorite&friendID=110852663&public=0>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a><br>
<a href=(URL address blocked: See forum rules)=block.blockUser&userID=110852663>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0"</a>
<BR>
<a href=(URL address blocked: See forum rules)=user.viewComments&friendID=110852663&MyToken=f7d8ef58-6dd3-4d2d-b3b4-d1394c2aec1a>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>

<BR>
<a href=(URL address blocked: See forum rules)=vids.myvideos>
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>


<BR>
<a href="(URL address blocked: See forum rules)" target="new">
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>



<BR>
<a href="mailto:ebrowne77@gmail.com">
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>



<BR>
<a href="(URL address blocked: See forum rules)=music&Mytoken=1232584F-A394-483A-99869640B802D9BD2832516" target="new">
<img src="(URL address blocked: See forum rules)" width="160" height="58" border="0">
</a></font>
<br><br><br>
<BR>
<a href="(URL address blocked: See forum rules)~117127" target="new">
<img src="(URL address blocked: See forum rules)" width="125" height="58" border="0">
</a>







</div>

<div class="div2">
<font size=2><b><font color=ffffff>
</font></div>


<div class="div3"><font color=ffffff> <center><font color="yellow">J Barre</font></center>
<br>
<center>
<img src="(URL address blocked: See forum rules)" width="100" height="250">
<br> <center><font color="yellow">Atlanta, GA <br> "A Lone Stallion Amongst Mules!"</font></center><center><br><br>
Comment Here<form method="post" action="(URL address blocked: See forum rules)=user.ConfirmComment"><input name="friendID" value="57340028" type="hidden"><textarea name="f_comments" style="width: 150px; height: 100px; background-color: FFFFFF; color: 000000; font-family: arial; font-size: 10px; border: 1px solid 000000; ">Holla at Your BOY!!! </textarea><br /><input type="submit" value="Post" /></form><br><a href="(URL address blocked: See forum rules)=user.viewComments&friendID=110852663" target=_blank>View/Edit Comments</a></center>
<BR>
<center><A
href="(URL address blocked: See forum rules)" target="new"><img
border="0"
src="(URL address blocked: See forum rules)" width="180" height="20"></A>
</center>
<br><br>
<center><a href="(URL address blocked: See forum rules)=3091027"><img src="(URL address blocked: See forum rules)" border="0"></a></center><br>
</div>

<div class="div4">
<center><img src="(URL address blocked: See forum rules)">
<br></center>
<div style="text-align:justify; text-justify:distribute-all-lines;>
<font size=2><b><font size="2" color="red">Hailing from Tulsa, Oklahoma, the man formerly known as "E.B." or "Encyclopedia Brown," is blazing a trail in hip-hop back to its essence: originality, thought, and struggle. Many are saying his timing couldn't be better. Heavily influenced by hip-hop, while it was still in his infancy, J Barre was founding member of the Def Boy breakin' crew. Soon after, he began honing his skills as a beat boxer which sparked his ambition to become an emcee. His first recording goes back to the age of 9. He developed his charismatic stage presence and experience from numerous talent shows and mic battles. After attending Howard University in DC, he went back home to Tulsa,OK and helped to form and establish the underground super group Medu Netr in 1998. Grindin' and building his technique and further feeding his passion for hip-hop, J Barre became one of the most seasoned and well known MCs in Oklahoma. Migrating to Atlanta, GA in 2002, J Barre set out to get his skills marketed in the right direction. J Barre has performed in Harlem, New York to L.A., California and is currently preparing for a promotional tour for his freshman solo project due out Summer 2007. His determination to preserve the traditions of hip-hop, and his raw talent, help him easily exceed competitors...he is a lone stallion amongst mules.</div>
</font></div>




<style>td td object {position:absolute;left:272px; top:672px;}</style>


</td></tr></table></td></tr></table> <div class="comt"><table class="off"><tr><td><table><tr><td>

Thanks for taking time to read my question.

How do I position 3 pictures beside eachother with no spaces between them? (so they look like one continuous picture)

eg:
______
|1|2|3|
|_|_|_|

instead of
________
|1||2||3|
|_||_||_|

Thanks,

Brad

Hi, I'm having a slight problem with my css.

I want to display a comment with a number of images to the right of it.

e.g

"Excellent" plus 5 stars next to it (note: images of stars)

so i tried this:

Code:

 <div id = "commentText"> Excellent </div> 
		 
  <div id = "star"> </div>
  <div id = "star"> </div>
  <div id = "star"> </div>
 
  <div id = "commentText"> Fantastic </div> 
   <div id = "star"> </div>
   <div id = "star"> </div>
   <div id = "star"> </div>
   <div id = "star"> </div>

css

Code:

#commentText
{
  font-size: 100%;
  color: #000000;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-weight: normal;
  padding-left: 30px;
}

#star 
{
  display: inline;
  height: 24px;
  background-image: url(images/star.png);
  background-repeat: no-repeat;
  padding-left: 20px;
  
}

I currently have comment with 3 stars displayed underneath it - however they are only half being shown for some reason.

Any help is appreciated to help me get the desired effect. Thanks!