| | |
How to have the div layer center on any browser?
Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
![]() |
•
•
Join Date: Aug 2006
Posts: 57
Reputation:
Solved Threads: 0
hello im trying to get my div layer to align so that it centers on the browser so it doesnt matter about the size of somones browser it will always be centered on the page. i have tried
[HTML]<div align="center" class="style1" id="Layer1">[/HTML]
but this doesnt seem to work when i view it in my browser and make the browser page smaller. i am doing this in dreamweavers test browser, could this be the problem? any help would be very much apreciated
[HTML]<div align="center" class="style1" id="Layer1">[/HTML]
but this doesnt seem to work when i view it in my browser and make the browser page smaller. i am doing this in dreamweavers test browser, could this be the problem? any help would be very much apreciated
•
•
Join Date: Oct 2006
Posts: 9
Reputation:
Solved Threads: 0
align=center doesn't work on divs.
try this:
try this:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
body { text-align: center; } .style1 { margin: auto auto; }
www.rozengain.com - Web Development Blog
•
•
Join Date: Aug 2006
Posts: 57
Reputation:
Solved Threads: 0
thanks but i have tried that and this way but it still doesnt work for some reason
[HTML]#Layer1 {
position:absolute;
width:800px;
height:800px;
margin-right:auto;
margin-right:auto;
}[/HTML]
is it the position absolute that i need to delete? might try that now
[HTML]#Layer1 {
position:absolute;
width:800px;
height:800px;
margin-right:auto;
margin-right:auto;
}[/HTML]
is it the position absolute that i need to delete? might try that now
•
•
Join Date: Aug 2006
Posts: 57
Reputation:
Solved Threads: 0
nope not the position absolute either:rolleyes:
•
•
Join Date: Oct 2006
Posts: 9
Reputation:
Solved Threads: 0
use
don't use
and don't forget
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
margin: auto auto;
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
margin-right: auto; margin-right: auto;
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
body { text-align: center; }
Last edited by BudBrocken; Nov 2nd, 2006 at 11:37 am.
www.rozengain.com - Web Development Blog
•
•
Join Date: Aug 2006
Posts: 57
Reputation:
Solved Threads: 0
aha thanks your a star! do you know how i keep the divs inside this div from moving?
i.e there left and top attributes?
i.e there left and top attributes?
•
•
Join Date: Aug 2006
Posts: 57
Reputation:
Solved Threads: 0
ive got the main layer to staycentral thanks. but how do i keep the layers on top of this in the same position on that layer when the browser size changes?
•
•
Join Date: Aug 2006
Posts: 57
Reputation:
Solved Threads: 0
this is how i have set the layers over another layer
[HTML]<div class="style1" id="Layer1"><img src="dmlayer1.png" width="800" height="800" />
<div id="Layer7"></div>
<div id="Layer6"></div>
<div id="Layer5">
<div align="left"> </div>
</div>
<div id="Layer4">
<object classid="clsid
27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="501" height="115">
<param name="movie" value="dmtitle.swf" />
<param name="quality" value="high" /><param name="LOOP" value="false" />
<embed src="dmtitle.swf" width="501" height="115" loop="false" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object>
</div>
<div id="Layer2">
<object classid="clsid
27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="150" height="150">
<param name="movie" value="fruitdm.swf" />
<param name="quality" value="high" />
<embed src="fruitdm.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="150" height="150"></embed>
</object>
</div>
</div>[/HTML]
and this is how one of the layers is currently set out in css
[HTML]#Layer3 {
position:absolute;
width:200px;
height:115px;
z-index:2;
left: 314px;
top: 32px;
background-color: #FFFFFF;
}[/HTML]
[HTML]<div class="style1" id="Layer1"><img src="dmlayer1.png" width="800" height="800" />
<div id="Layer7"></div>
<div id="Layer6"></div>
<div id="Layer5">
<div align="left"> </div>
</div>
<div id="Layer4">
<object classid="clsid
27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="501" height="115"><param name="movie" value="dmtitle.swf" />
<param name="quality" value="high" /><param name="LOOP" value="false" />
<embed src="dmtitle.swf" width="501" height="115" loop="false" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object>
</div>
<div id="Layer2">
<object classid="clsid
27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="150" height="150"><param name="movie" value="fruitdm.swf" />
<param name="quality" value="high" />
<embed src="fruitdm.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="150" height="150"></embed>
</object>
</div>
</div>[/HTML]
and this is how one of the layers is currently set out in css
[HTML]#Layer3 {
position:absolute;
width:200px;
height:115px;
z-index:2;
left: 314px;
top: 32px;
background-color: #FFFFFF;
}[/HTML]
![]() |
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Is my code wrong or is Opera?
- Next Thread: Content Breaking thru Borders
| Thread Tools | Search this Thread |
acid2 ajax ajaxexample ajaxjspservlets array browser bug captchaformproblem cart checkbox child class close codes createrange() css cursor date debugger decimal dependent design disablefirebug dom dropdown editor element embed engine enter error events explorer ext file firefox focus form forms frameworks getselection google gxt hiddenvalue highlightedword hint html ie7 ie8 iframe images index internet java javascript javascripthelp2020 jquery jsf jsfile jsp jump libcurl listbox maps masterpage math media menu mp4 object onmouseoutdivproblem onmouseover onreadystatechange parent paypal pdf php position post problem programming progressbar prototype redirect runtime safari scale scriptlets scroll search security shopping size software toggle unicode w3c web wysiwyg \n






