Increase or decrease page

HTML & CSS
1

Little problem…
If I press “ctrl+” to increase or “ctrl-” to decrease the page, the image on the slide show is out of place and I wanted the image to stay centered.

This is the url: http://www.esportes.ufu.br/teste/index.php

This is the css code to center the slide show:


#demos{
	position:absolute;
	left:47%;
	top:17%;
	margin-left:-110px;
	margin-top:40px;
}

Html code:


<div id="demos">
<br /><br /><br />
<table align="center" border="1"><tr><td>
    <div id="fade" class="pics">
    <img src="Imagens/Inicial/01.JPG" alt="" />    
    <img src="Imagens/Inicial/02.JPG" alt="" />
    <img src="Imagens/Inicial/03.JPG" alt="" />
    </div>
    <pre><code class="mix">$('#fade').cycle();</code></pre>
</td></tr></table>
</div>

Someone knows a better way to do this?

2

Prob should get rid of the position absolute. Just give the div margin: 20px auto; should do the trick.

3

It worked on Chrome and Firefox, but IE is not centered (I hate IE)
Now the image “follows” the page if I press “ctrl+” or “ctrl-” in all browsers
But IE is not centered… I try this … but won’t work either…

<!–[if gte IE 6]><!–>
<style>
#demos{
margin-left:115px;
}
</style>
<!–<![endif]–>

4

IE will not center if it is in quirks mode. I’m assuming that is probably due to a comment above the doctype or not a correct and/or patrial doctype. Once those are corrected IE should center the div with margin auto.

5

Well… i guess the doctype is right
And there’s nothing above it


<!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" xml:lang="en" lang="en">
<head> 
...
6

OK I just looked at the code. Well right now you only have margin-right auto and margin-left 0. if you make them both auto as it should to center then the page goes broke. I’d have to guess that’s because of all the tables and poorly coded stuff. Unfortunately that’s to much for me to get into - sorry. To do it properly use a strick html (not X) doctype and scrub all the table stuff. I’m afraid I cant help much till then. Dont fret, some young stud will come in and show you the light soon probably.

7

Remove the deprecated align=center from the table and it should center by itself with any luck.


<table [B]align="center" [/B]border="1">
8

It worked!!
Thank you so much (again) =)

9

Thank you for the help!!

10

Or old STUD!

11

Lol :slight_smile: