Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Junior Member
    Join Date
    Sep 2010
    Posts
    8
    Member #
    23692
    So I've tried many many things and I can't figure out how to center my sliced PSD Layout using the positioning settings for css in dreamweaver. Please help. Here is the css and html:
    Code:
    <html>
    <head>
    <title>layout</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <!-- Save for Web Styles (layout.psd) -->
    <style type="text/css">
    <!--
    body {
    	font: 100% Verdana, Arial, Helvetica, sans-serif;
    background-image: url(backround.gif);
    	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
    	padding: 0;
    	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
    	color: #000000;
    }
    .oneColLiqCtr #Table_01 {
    	width: 80%;  /* this will create a container 80% of the browser width */
    	background: #FFFFFF;
    	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
    	border: 1px solid #000000;
    	text-align: left; /* this overrides the text-align: center on the body element. */
    	
    }
    
    
    
    #squeezepageidea1-1 {
    	position:absolute;
    	left:0px;
    	top:0px;
    	width:900px;
    	height:299px;
    }
    
    #squeezepageidea1-2 {
    	position:absolute;
    	left:0px;
    	top:299px;
    	width:47px;
    	height:864px;
    }
    
    #squeezepageidea1-3 {
    	position:absolute;
    	left:47px;
    	top:299px;
    	width:455px;
    	height:297px;
    }
    
    #squeezepageidea1-4 {
    	position:absolute;
    	left:502px;
    	top:299px;
    	width:19px;
    	height:316px;
    }
    
    #squeezepageidea1-5 {
    	position:absolute;
    	left:521px;
    	top:299px;
    	width:334px;
    	height:297px;
    }
    
    #squeezepageidea1-6 {
    	position:absolute;
    	left:855px;
    	top:299px;
    	width:45px;
    	height:864px;
    }
    
    #squeezepageidea1-7 {
    	position:absolute;
    	left:47px;
    	top:596px;
    	width:455px;
    	height:19px;
    }
    
    #squeezepageidea1-8 {
    	position:absolute;
    	left:521px;
    	top:596px;
    	width:334px;
    	height:19px;
    }
    
    #squeezepageidea1-9 {
    	position:absolute;
    	left:47px;
    	top:615px;
    	width:808px;
    	height:181px;
    }
    
    #squeezepageidea1-10 {
    	position:absolute;
    	left:47px;
    	top:796px;
    	width:808px;
    	height:35px;
    }
    
    #squeezepageidea1-11 {
    	position:absolute;
    	left:47px;
    	top:831px;
    	width:377px;
    	height:332px;
    }
    
    #squeezepageidea1-12 {
    	position:absolute;
    	left:424px;
    	top:831px;
    	width:22px;
    	height:332px;
    }
    
    #squeezepageidea1-13 {
    	position:absolute;
    	left:446px;
    	top:831px;
    	width:409px;
    	height:332px;
    }
    
    #squeezepageidea1-14 {
    	position:absolute;
    	left:0px;
    	top:1163px;
    	width:900px;
    	height:37px;
    }
    
    -->
    </style>
    <!-- End Save for Web Styles -->
    </head>
    <body class="oneColLiqCtr">
    <!-- Save for Web Slices (layout.psd) -->
    <div id="Table_01">
    	<div id="squeezepageidea1-1">
    		<img src="images/squeezepageidea1_1.png" width="900" height="299" alt="">
    	</div>
    	<div id="squeezepageidea1-2">
    		<img src="images/squeezepageidea1_2.png" width="47" height="864" alt="">
    	</div>
    	<div id="squeezepageidea1-3">
    		<img src="images/squeezepageidea1_3.png" width="455" height="297" alt="">
    	</div>
    	<div id="squeezepageidea1-4">
    		<img src="images/squeezepageidea1_4.png" width="19" height="316" alt="">
    	</div>
    	<div id="squeezepageidea1-5">
    		<img src="images/squeezepageidea1_5.png" width="334" height="297" alt="">
    	</div>
    	<div id="squeezepageidea1-6">
    		<img src="images/squeezepageidea1_6.png" width="45" height="864" alt="">
    	</div>
    	<div id="squeezepageidea1-7">
    		<img src="images/squeezepageidea1_7.png" width="455" height="19" alt="">
    	</div>
    	<div id="squeezepageidea1-8">
    		<img src="images/squeezepageidea1_8.png" width="334" height="19" alt="">
    	</div>
    	<div id="squeezepageidea1-9">
    		<img src="images/squeezepageidea1_9.png" width="808" height="181" alt="">
    	</div>
    	<div id="squeezepageidea1-10">
    		<img src="images/squeezepageidea1_10.png" width="808" height="35" alt="">
    	</div>
    	<div id="squeezepageidea1-11">
    		<img src="images/squeezepageidea1_11.png" width="377" height="332" alt="">
    	</div>
    	<div id="squeezepageidea1-12">
    		<img src="images/squeezepageidea1_12.png" width="22" height="332" alt="">
    	</div>
    	<div id="squeezepageidea1-13">
    		<img src="images/squeezepageidea1_13.png" width="409" height="332" alt="">
    	</div>
    	<div id="squeezepageidea1-14">
    		<img src="images/squeezepageidea1_14.png" width="900" height="37" alt="">
    	</div>
    </div>
    <!-- End Save for Web Slices -->
    </body>
    </html>

  2.  

  3. #2
    Junior Member
    Join Date
    Nov 2008
    Posts
    5
    Member #
    17739
    I don't think that all elements need absolute position, sometimes it can mess up layout and why do you use src="" instead of setting background for div elements?
    What's more, about absolute positioning...I just noticed that you use values like top, left etc, don't they work only with relative positioning?

    EDIT: try making oneColLiqCtr into id selector, not class.
    EDIT nr.2: It seems top, bottom, left, right values works with both absolute and relative positioning, although in a different way.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:56 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com