making 3 colums fill grey area in height

hi,

i was wondering on my page if i could make the 3 columns on testing.actionit.ie fill u the grey area (basicaly bigger on the page)

thanks a mill
jonathanduane2010Asked:
Who is Participating?
 
jayantcConnect With a Mentor Commented:
try modifying this css

#homeleft {
    background: #CCCCCC;
    float: left;
    height: 240px;
    width: 610px;
}
0
 
HainKurtSr. System AnalystCommented:
??? what is your page? did you miss anything? like url or code?
0
 
jonathanduane2010Author Commented:
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
HainKurtSr. System AnalystCommented:
could not get what you are on... maybe you should post a screenshot of what you want to do
0
 
jonathanduane2010Author Commented:
i have attached the code,

the page should be online http://testing.actionit.ie/index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Ray Shah, DJ Ray Shah, rayshah.com, Subliminal Records, Subliminal Sessions, Pacha, Miami, Ibiza, New York" />

 

<meta name="description" content=" Official site of international DJ Ray Shah. All the latest videos, pics, dates, music and news..."/>


<title>Ray Shah</title>

<link rel="stylesheet" type="text/css" href="http://testing.actionit.ie/css/main.css" />
            	<link rel="stylesheet" type="text/css" href="http://testing.actionit.ie/css/main2.css" />

		<style type="text/css">
body {background-image:url(backgrounds/bghome.jpg);}
</style>

<script type="text/javascript">
function openNewWindow(URLtoOpen, windowName, windowFeatures) { 
  newWindow=window.open(URLtoOpen, windowName, windowFeatures); } </script>

  
  <style type="text/css">
#facebook {float: left;height: 240px;margin-left: 10px;width: 300px;}
#fbtrans {background-color: black;height: 240px;opacity: 0.4;position: absolute;width: 300px;z-index: 1;}
#fbboxtext {background: url("http://testing.actionit.ie/images/fb.png") repeat scroll 0 0 transparent;
    height: 240px;position: absolute;width: 300px;z-index: 4;}
#fbboxheader {height: 50px;margin-left: 20px;margin-top: 10px;text-align: right;width: 260px;}
#fbboxmain {height: 180px;overflow: hidden;width: 300px;}
#homenews {float: left;height: 240px;width: 300px;}
#newstrans {background-color: black;height: 240px;opacity: 0.4;position: absolute;width: 300px;z-index: 1;}
#newstext {background: url("http://testing.actionit.ie/images/NewsBox.png") repeat scroll 0 0 transparent;
    height: 240px;width: 300px;position: absolute;z-index: 4;}
#newsheader {height: 50px;margin-left: 20px;margin-top: 10px;text-align: right;width: 260px;}
#newsboxmain {height: 180px;margin-left: 20px;overflow: hidden;width: 260px;}
	  </style>
</head>

<body >

<div id="container">
<div id="topbar">
<div id="topbarinner">
<div id="audioplayer"><a title="Open Audio Player" onmouseover="audioplayerimg.src='images/audioplayer_over.jpg'" onmouseout="audioplayerimg.src='images/audioplayer.jpg'" onclick="window.open('audio-player.html', 'win1', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=450,height=370');" href="#">.</a></div>

<div id="navhome" ><a href="index.html" class="navLinksSelected" >HOME</a></div>
<div id="navnews"  ><a href="news/index.html" class="navLinks" >NEWS</a></div>
<div id="navphotos"  ><a href="photos.html" class="navLinks" >PHOTOS</a></div>
<div id="navvideos"  ><a href="videos.html" class="navLinks" >VIDEOS</a></div>
<div id="navpodcasts" ><a href="podcasts.html" class="navLinks" >GIGS</a></div>
<div id="navlinks"  ><a href="links.html" class="navLinks" >LINKS</a></div>
<div id="navcontact" ><a href="contact.php" class="navLinks" >CONTACT</a></div>
</div>
</div>
	<div id="topdiv"><div id="outerDiv">

	<div id="semiTransparentDiv" ></div>
	
   <style type="text/css">
#outerDiv {height:770px;}
#topdiv {height:870px;}
</style> 
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<div id="contentDiv" style="height:750px">
   <div id="contentheader" >
   
   		<div id="logo"><img alt="Ray Shah Logo" width="145" height="72" title="Ray Shah Logo" src="images/ray-shah-logo.png"  class="imggenie6" /></div>
   </div>
     <div id="contentmain" style="height:650px">

     <!-- content start-->
    <div id="homemain" style="width:920px;height:650px;">
       
       <div id="hometop" ><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="920" height="230">
  <param name="movie" value="swfs/flashHP.swf" />
  <param name="quality" value="high" />
  <param name="wmode" value="transparent" />
  <embed src="swfs/flashHP.swf" width="920" height="230" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object></div>


<!-- 3 BOX START -->
<div id="homeleft" style="width:920px;" >

  
            <!-- NEWS BOX-->
       		 <div id="homenews" >
			 <div id="newstrans" ></div><div id="newstext" >
			 <div id="newsheader"> </div>
       		   <div id="newsboxmain"> Random Text. Random Text. Random Text.</div></div>
      </div>
	  <!-- NEWS BOX END-->
            <!-- TWITTER BOX-->
            <div id="hometwitter" >
            <div id="twittertrans" ></div><div id="twittertext" >
              <div id="twitterheader"><a href="http://twitter.com/Ray_Shah/status/29547586679476224"><img height="25" width="100" src="http://testing.actionit.ie/images/spacer.gif" /> </a></div><div id="twittermain">
         <script src="http://widgets.twimg.com/j/2/widget.js"></script>

<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 3,
  interval: 6000,
  width: 260,
  height: 180,
  theme: {
    shell: {
      background: 'transparent',
      color: '#ffffff'
    },
    tweets: {
      background: 'transparent',
      color: '#ffffff',
      links: '#0A90C8'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    hashtags: true,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('').start();
</script><script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 4,
interval: 6000,
width: 250,
height: 300,
theme: {
shell: {
background: '#333333',
color: '#ffffff'
},
tweets: {
background: '#000000',
color: '#ffffff',
links: '#eb6607'
}
},
features: {
scrollbar: false,
loop: true,
live: false,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'default'
}
}).render().setUser('Ray_Shah').start();
</script></div></div>
      </div><!-- TWITTER BOX END-->
	  
<!-- FACEBOOK BOX -->
	  <div id="facebook">
	  <div id="fbtrans"></div><div id="fbboxtext">
	    <div id="fbboxmain"><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FRay-Shah-DJ-MC-and-Presenter%2F108458002548008&amp;width=292&amp;colorscheme=dark&amp;show_faces=true&amp;stream=true&amp;header=true&amp;height=427" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:180px;" allowTransparency="true"></iframe>
		
		</div></div>

	  </div>
	  <!-- FACEBOOK BOX END-->
     </div>
	 <!-- 3 BOX END-->
	   
	   
	   
	   
      </div>
             </div>
    </div>
      <!-- content end-->
     </div>
   </div>
    </div>

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-7145724-7']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

</body>

</html>

Open in new window

0
 
HainKurtSr. System AnalystCommented:
i can see the page but I could not get what is wrong here, and what do you want to accomplish... maybe you should post a screenshot showing what is wrong/or what changes you want here...
0
 
jonathanduane2010Author Commented:
i would like to change the height of the colums
0
 
HainKurtConnect With a Mentor Sr. System AnalystCommented:
try changing heights of these classes

newtrans: height = 410px
twittertrans: height = 410px
fbtrans: height = 410px

fbboxtext: height = 510px
0
 
HainKurtSr. System AnalystCommented:
also remove

fbboxmain: height

or set it to 410px
0
All Courses

From novice to tech pro — start learning today.