|
|
|
Junior Member
      
Group: Forum Members
Last Login: 3/3/2007 6:14:43 AM
Posts: 16,
Visits: 12
|
|
Hi guys,
I need to create a div that is in the centre of the page using styles. The div needs to have gray border.
Anyone?
|
|
|
|
|
Forum Member
      
Group: Forum Members
Last Login: 2/8/2007 8:41:42 AM
Posts: 45,
Visits: 35
|
|
Pretty simple, try this out<div style="position: relative;"> <div style="position: absolute; left: 25%; width: 50%; border: 1px solid #c0c0c0;">Something</div> </div>
|
|
|
|
|
Junior Member
      
Group: Forum Members
Last Login: 3/3/2007 6:14:43 AM
Posts: 16,
Visits: 12
|
|
| Thanks chillywilly, your code looks good, but it didn't center my object. I'm using a flash .swf object and trying to get it centered. Any ideas?
|
|
|
|
|
Forum Member
      
Group: Forum Members
Last Login: 2/7/2007 11:36:07 AM
Posts: 38,
Visits: 35
|
|
ASsuming you need a fixed width for the flash file, you'll need client side script for this.<script type="text/javascript"> window.onload = WindowLoad; function WindowLoad(event) { var objDiv = document.getElementById( "MainContainer" ); objDiv.style.left = parseInt((document.body.clientWidth-objDiv.clientWidth)/2)+"px"; } </script> <div style="position: relative;"> <div id="MainContainer" style="position: absolute; border: 1px solid #c0c0c0;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="800" height="600" id="preloader_v03" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="preloader_v03.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><embed src="preloader_v03.swf" quality="high" bgcolor="#ffffff" width="800" height="600" name="preloader_v03" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object> </div> </div>
|
|
|
|
|
Junior Member
      
Group: Forum Members
Last Login: 3/3/2007 6:14:43 AM
Posts: 16,
Visits: 12
|
|
| That did it, you're the best! Cheers!
|
|
|
|
|
Junior Member
      
Group: Forum Members
Last Login: 12/14/2007 9:52:59 AM
Posts: 10,
Visits: 4
|
|
great help thnx
complexity is a symptom of confusion not a cause
|
|
|
|
|
Forum Newbie
      
Group: Forum Members
Last Login: 6/28/2009 1:56:02 AM
Posts: 8,
Visits: 2
|
|
night_day (1/28/2007)
ASsuming you need a fixed width for the flash file, you'll need client side script for this.
<script type="text/javascript">
window.onload = WindowLoad;
function WindowLoad(event) {
var objDiv = document.getElementById( "MainContainer" );
objDiv.style.left = parseInt((document.body.clientWidth-objDiv.clientWidth)/2)+"px";
}
</script>
<div style="position: relative;">
<div id="MainContainer" style="position: absolute; border: 1px solid #c0c0c0;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="800" height="600" id="preloader_v03" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="preloader_v03.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" /><embed src="preloader_v03.swf" quality="high" bgcolor="#ffffff" width="800" height="600" name="preloader_v03" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>
</div>
this is nice answer thanks night day
try the other side
|
|
|
|
|
Forum Newbie
      
Group: Banned Members
Last Login: 7/15/2009 9:45:40 AM
Posts: 2,
Visits: 14
|
|
|
|
|
|
Forum Newbie
      
Group: Forum Members
Last Login: 1/16/2010 8:53:26 PM
Posts: 3,
Visits: 1
|
|
|
|
|
|
Forum Newbie
      
Group: Forum Members
Last Login: 6/4/2010 9:03:18 AM
Posts: 5,
Visits: 7
|
|
I've always used the old "Centering Trick" when i code my templates up for the web. I use "margin: auto 0" in the css page. It is a great way to center your content and haven't to worry about how to center other stuff because it automatically centers all the content within that div.
Company
|
|
|
|