Announcement

Collapse
No announcement yet.

Strange alignment

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
    #1

    Strange alignment

    Would somebody with IE7 please have a look at my site alignment. www.snowcam.co.za

    I have used the contemporary theme. The website should be centre aligned. The site displays correctly in FF and on my IE7 machine at home but here in this dungeon, mockingly referred to as an office, my site aligns to the left when viewed in IE7.

    In my CSS:

    html, body {
    width: 950px;
    padding: 0px;
    margin: 0 auto;
    }

    I have tried adding "text-align: left" to the CSS and <div align="center"></div> & even <center></center> to the inside of the body tags. I have also tried adding align="center" to the first table but nothing has solved the problem.

    I'm at a loss as to what more to try.
    "Opportunities multiply as they are seized." - Sun Tzu
    Tags: None
    #2
    Not sure why Jon - looks fine in my IE7 browser here.

    Comment

      #3
      use a div with left and right margins set to auto.

      HTML Code:
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
#wrapper {
	background-color: #CCCCCC;
	height: 300px;
	width: 640px;
	margin-right: auto;
	margin-left: auto;
	border: 2px dotted #333333;
}
-->
</style>
</head>

<body>
<div id="wrapper"></div>
</body>
</html>

      Comment

        #4
        Thanks Duncan. That's what I thought. Not to perturbed then.

        Originally posted by gabrielcrowe
        use a div with left and right margins set to auto.

        HTML Code:
        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
#wrapper {
	background-color: #CCCCCC;
	height: 300px;
	width: 640px;
	margin-right: auto;
	margin-left: auto;
	border: 2px dotted #333333;
}
-->
</style>
</head>

<body>
<div id="wrapper"></div>
</body>
</html>
        Thanks Gabe. I gave this a try and it worked a charm but cut the last 310px off of the right of my header img. Changing the width of the wrapper to 950px results in the page being left aligned again.
        "Opportunities multiply as they are seized." - Sun Tzu

        Comment

          #5
          dont believe you.

          drop all the css in your body. dont use any tricks.

          then use that wrapper around everything, starting just below the body and ending just before the /body.

          show me the css you're using or an example page?

          Comment

            #6
            It may be worth noting that my top banner img is defined in my CSS.

            .page_header {
            background-image: url('Logo_SNOWcam_1.gif');
            background-color: #000000;
            margin: 0px;
            }

            I dropped the code in exactly as you gave it. The following two images depict what I get with the width defined to 640 and 950.
            Attached Files
            "Opportunities multiply as they are seized." - Sun Tzu

            Comment

              #7
              i cant understand why.
              i'm afraid that it aligns left for me in IE7 too.

              start from scratch?

              Comment

                #8
                Originally posted by gabrielcrowe
                i'm afraid that it aligns left for me in IE7 too.
                Now this is a problem. I'll try using your wrapper with my logo defined in site options. Maybe that will work.
                "Opportunities multiply as they are seized." - Sun Tzu

                Comment

                  #9
                  Gabe. Using the logo container with the wrapper has fixed the alignment problem.

                  But please take a look at the attached image. My T&Cs container has now been pushed down.

                  My CSS for the container:
                  .page_header_terms_cart_login_container {
                  float: right;
                  text-align: right;
                  }

                  My CSS for my header:
                  .page_header {
                  background-color: #000000;
                  margin: 0px;
                  }
                  Attached Files
                  "Opportunities multiply as they are seized." - Sun Tzu

                  Comment

                  Previous template Next
                  Working...
                  X