...

View Full Version : troubles centering.



robin9000
12-30-2009, 11:23 PM
I have a page with a slide show and I don't seem to be able to get my page to center my slide show. I have tried the normal methods but they don't seem to be working.

my page is
http://robinsden.co.cc/services/photography/nature.php

I also don't seem to be able to get it to act like it's part of the page. It seems to want to go over top of my footer.

Any help provided would be appreciated, Thanks.

Excavator
12-30-2009, 11:35 PM
Hello robin9000,
You have your slideshow absolutely positioned at top:0; right:0;

Remove these bits highlighted in red -

<!--Content starts here-->
<div align="center">
<div class="setTitle">Nature</div>
<div style="position: relative;" class="slideShow">
<div style="position: absolute; top: 0px; left: 0px; display: block; z-index: 5; opacity: 1;" id="slide1" class="slides">

robin9000
12-31-2009, 12:32 AM
Hello robin9000,
You have your slideshow absolutely positioned at top:0; right:0;

Remove these bits highlighted in red -

<!--Content starts here-->
<div align="center">
<div class="setTitle">Nature</div>
<div style="position: relative;" class="slideShow">
<div style="position: absolute; top: 0px; left: 0px; display: block; z-index: 5; opacity: 1;" id="slide1" class="slides">

When I view my source code I seem to get the following:

<!--Content starts here-->
<div align="center">
<div class="setTitle">Nature</div>
<div class="slideShow">
<div id="slide1" class="slides">
<div class="slideTitle">Farmers Sunrise 1/4</div>
<img src="../../Images/services/photography/nature/outdoors9.jpg" height="400" width="520" border="0" alt="" /> </div>

Where do I find the code you are talking about? Thanks.

Daybreak0
12-31-2009, 01:06 AM
You should actually have all your CSS in your sylesheets, as you also have stylesheets affecting your pages as well.

CSS in the html is inline CSS and will overide any in the stylesheets

anyway to your problem -


<!--Content starts here-->
<div align="center">

align="center" is norammly used in old style tables, and am not even sure it will work with a div.

Try this

<div style="text-align: center; margin-left: 50%; margin-right: 50%">
Should work over most browsers

Excavator
12-31-2009, 02:04 AM
Where do I find the code you are talking about? Thanks.

Oops, looks like it's getting that from one of those jquery js files.

You can grab the .slideShow and center that though.
Add the bit highlighted in red to your slideshow.css file -
.slideShow {
background-color: #c5a665;
text-align: center;
margin-bottom: 10px;
padding: 5px;
width: 512px;
}
.slides {
position: relative;
z-index: 1;
display: none;
}
.setTitle, .slideTitle {
font-family: "Franklin Gothic Book", Arial, Helvitica, sans-serif;
}
.setTitle {
color: #FFFFFF;
font-size: 14px;
font-weight: bold;
}
.slideTitle {
color: #000000;
font-size: 12px;
}
.controls {
position: relative;
z-index: 10;
}
#slide1 {
display: block;
}

img {
border: outset 1px #999999;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum