Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

making 3 colums fill grey area in height

Posted on 2011-02-10
9
Medium Priority
?
269 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 59

Expert Comment

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

Author Comment

by:jonathanduane2010
ID: 34866285
0
 
LVL 59

Expert Comment

by:HainKurt
ID: 34866492
could not get what you are on... maybe you should post a screenshot of what you want to do
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 

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 59

Expert Comment

by:HainKurt
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 500 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 59

Assisted Solution

by:HainKurt
HainKurt earned 500 total points
ID: 34871741
try changing heights of these classes

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

fbboxtext: height = 510px
0
 
LVL 59

Expert Comment

by:HainKurt
ID: 34871784
also remove

fbboxmain: height

or set it to 410px
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

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

Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

715 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