Solved

making 3 colums fill grey area in height

Posted on 2011-02-10
9
260 Views
Last Modified: 2012-05-11
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
0
Comment
Question by:jonathanduane2010
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
9 Comments
 
LVL 53

Expert Comment

by:Huseyin KAHRAMAN
ID: 34866067
??? what is your page? did you miss anything? like url or code?
0
 

Author Comment

by:jonathanduane2010
ID: 34866285
0
 
LVL 53

Expert Comment

by:Huseyin KAHRAMAN
ID: 34866492
could not get what you are on... maybe you should post a screenshot of what you want to do
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:jonathanduane2010
ID: 34866595
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
 
LVL 53

Expert Comment

by:Huseyin KAHRAMAN
ID: 34867963
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
 
LVL 4

Accepted Solution

by:
jayantc earned 125 total points
ID: 34868600
try modifying this css

#homeleft {
    background: #CCCCCC;
    float: left;
    height: 240px;
    width: 610px;
}
0
 

Author Comment

by:jonathanduane2010
ID: 34868906
i would like to change the height of the colums
0
 
LVL 53

Assisted Solution

by:Huseyin KAHRAMAN
Huseyin KAHRAMAN earned 125 total points
ID: 34871741
try changing heights of these classes

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

fbboxtext: height = 510px
0
 
LVL 53

Expert Comment

by:Huseyin KAHRAMAN
ID: 34871784
also remove

fbboxmain: height

or set it to 410px
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

739 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question