...

View Full Version : position:absolute, Can it be changed in DW?



xxnonamexx
08-03-2011, 11:21 AM
In DW my main issue is alignment, positioning. I read alot on the 'net regarding how its not the greatest alignment script. Dreamweaver automatically places it in the code. If I am trying to make my code play nice with other browsers and display correctly on a phone etc instead of the text out of alignment etc. Can I just change the absolute to relative or static? I am curious since I am having trouble with CSS I would like to finish my current website before I start a new one the proper way. Thanks

vikram1vicky
08-03-2011, 11:59 AM
In DW my main issue is alignment, positioning. I read alot on the 'net regarding how its not the greatest alignment script. Dreamweaver automatically places it in the code. If I am trying to make my code play nice with other browsers and display correctly on a phone etc instead of the text out of alignment etc. Can I just change the absolute to relative or static? I am curious since I am having trouble with CSS I would like to finish my current website before I start a new one the proper way. Thanks

Share website link or source code

DanInMa
08-03-2011, 02:15 PM
in dreamweaver it can be done very easily. in most newer versions your css rules should show up on the right hand side and you just click on them to bring up the edit box.

if you want your sight to display well on a phone then you need to use a seperate styel sheet

this guy has a great example to work from - http://matthewjamestaylor.com/blog/perfect-multi-column-liquid-layouts

here are some good tips for iphones specifically http://eisabainyo.net/weblog/2009/06/12/making-a-website-iphone-friendly-using-css/

xxnonamexx
08-03-2011, 02:50 PM
What should I be selecting instead of absolute positioning to keep the images, text from shifting in certain browsers?

I checked his website but I am not sure if he has a template I need. I am looking for a header, content, footer. Unless I can add to the one column template he has provided.

This was created using FlexiCSS DW extension


<!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">



<head>



<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />



<title>Untitled Document</title>



<link href="includes/CSSLayouts/CSSLayouts.css" rel="stylesheet" type="text/css" />



<script type="text/javascript" src="includes/CSSLayouts/debug_plus.js"></script>



<link href="includes/CSSLayouts/PSLayout.css" rel="stylesheet" type="text/css" />



<link href="includes/CSSLayouts/PSLayout_user.css" rel="stylesheet" type="text/css" />



</head>







<body class="PSLayout_body_design">



<div class="PSLayout">



<!-- (CSSLayouts Begin) #PSLayout #build_version=1.1.284;pack=;category=;layout=;layoutType=page;scheme =;cssSource=file;assets=;halign=center;minwidth=960px;maxwidth=960px;w idth=960px;bc=;bl=-->



<div class='cssLO PSLayout_wrapper_layout'>



<div class='wrapper cssLI PSLayout_wrapper_design'>



<div class='cssLO PSLayout_row_1_layout'>



<div class='row_1 cssLI PSLayout_row_1_design'>



<!-- row_1 Content Starts Here -->







<!-- row_1 Content Ends Here -->



</div>



</div>



<div class='cssLO PSLayout_row_2_layout'>



<div class='row_2 cssLI PSLayout_row_2_design'>



<div class='cssLO PSLayout_chair_layout'>



<div class='chair cssLI PSLayout_chair_design'>



<!-- chair Content Starts Here -->







<!-- chair Content Ends Here -->



</div>



</div>



<div class='cssLO PSLayout_waterfire_layout'>



<div class='waterfire cssLI PSLayout_waterfire_design'>



<!-- waterfire Content Starts Here -->



<p> <img src="storesm.jpg" width="291" height="202" /></p>



<p> </p>



<!-- waterfire Content Ends Here -->



</div>



</div>



<div class='cssLClearC'></div>



</div>



</div>



<div class='cssLO PSLayout_row_3_layout'>



<div class='row_3 cssLI PSLayout_row_3_design'>



<div class='cssLO PSLayout_row_6_layout'>



<div class='row_6 cssLI PSLayout_row_6_design'>



<!-- row_6 Content Starts Here -->







<!-- row_6 Content Ends Here -->



</div>



</div>



<div class='cssLO PSLayout_row_7_layout'>



<div class='row_7 cssLI PSLayout_row_7_design'>



<!-- row_7 Content Starts Here -->







<!-- row_7 Content Ends Here -->



</div>



</div>



<div class='cssLClearR'></div>



</div>



</div>



<div class='cssLClearR'></div>



</div>



</div>



<div class="cssLClearL"></div>



<!-- #PSLayout (CSSLayouts End) -->



</div>



</body>



</html>


Here is the more recent:
This is a older code


<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="includes/CSSLayouts/CSSLayouts.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="includes/CSSLayouts/debug_plus.js"></script>
<link href="includes/CSSLayouts/index.css" rel="stylesheet" type="text/css" />
<link href="includes/CSSLayouts/index_user.css" rel="stylesheet" type="text/css" />
</head>

<body class="index_body_design">
<div class="index">
<!-- (CSSLayouts Begin) #index #build_version=1.1.284;pack=;category=;layout=;layoutType=page;scheme=;cssSource=file;assets=;halign =center;minwidth=960px;maxwidth=960px;width=960px;bc=;bl=-->
<div class='cssLO index_wrapper_layout'>
<div class='wrapper cssLI index_wrapper_design'>
<div class='cssLO index_row_1_layout'>
<div class='row_1 cssLI index_row_1_design'>
<div class='cssLO index_header_layout'>
<div class='header cssLI index_header_design'>
<div class='cssLO index_logo_layout'>
<div class='logo cssLI index_logo_design'>
<!-- logo Content Starts Here -->
&nbsp; <img src="PSresize.jpg" width="424" height="75" />
<!-- logo Content Ends Here -->
</div>
</div>
<div class='cssLO index_address_layout'>
<div class='address cssLI index_address_design'>
<div class='cssLO index_blank_layout'>
<div class='blank cssLI index_blank_design'>
<!-- blank Content Starts Here -->
&nbsp;
<!-- blank Content Ends Here -->
</div>
</div>
<div class='cssLO index_addressphone_layout'>
<div class='addressphone cssLI index_addressphone_design'>
<!-- addressphone Content Starts Here -->
&nbsp;
13 Danbury Road (Rt. 7) Wilton, CT 06897<br />
By Appointment (203) 761-4922
<!-- addressphone Content Ends Here -->
</div>
</div>
<div class='cssLClearC'></div>
</div>
</div>
<div class='cssLClearC'></div>
</div>
</div>
<div class='cssLClearC'></div>
</div>
</div>
<div class='cssLO index_row_2_layout'>
<div class='row_2 cssLI index_row_2_design'>
<div class='cssLO index_column_1_layout'>
<div class='column_1 cssLI index_column_1_design'>
<!-- column_1 Content Starts Here -->
&nbsp;
<!-- column_1 Content Ends Here -->
</div>
</div>
<div class='cssLO index_column_2_layout'>
<div class='column_2 cssLI index_column_2_design'>
<div class='cssLO index_row_4_layout'>
<div class='row_4 cssLI index_row_4_design'>
<!-- row_4 Content Starts Here -->
&nbsp; <img src="SalonPanoramasmaller.jpg" width="826" height="233" />
<!-- row_4 Content Ends Here -->
</div>
</div>
<div class='cssLO index_row_6_layout'>
<div class='row_6 cssLI index_row_6_design'>
<!-- row_6 Content Starts Here -->
Our goal is to have a lofty and stylish salon with plenty of room for clients to lounge. We have leather sofas in front of a brick fireplace, views of the river, and best of all, massage chairs to sit in while getting your hair washed.
We are dedicated to each individual client. We endeavor to make whoever walks through our doors look and feel better about themselves. We are dedicated to the principle that everyone can be made to feel special by how they look. Every person brings a new challenge to the staff. It allows us to be creative and artistic because everyone's hair, personality, and lifestyle are different.
Owner, Philip, is a master stylist with over 16 years of experience. "I haven't stopped educating myself," he said. He continues his pursuit of perfection by consistently receiving high quality education from his contemporaries such as Vidal Sasson, Jaques Dessange, Bumble & Bumble and Minardi & Minardi. Additionally he has shared his knowledge by teaching at Redken for over 2 years. What differentiates Philip from others is his desire to please each and every customer by giving them more then they expect.
<!-- row_6 Content Ends Here -->
</div>
</div>
<div class='cssLClearR'></div>
</div>
</div>
<div class='cssLO index_column_3_layout'>
<div class='column_3 cssLI index_column_3_design'>
<!-- column_3 Content Starts Here -->
&nbsp;
<!-- column_3 Content Ends Here -->
</div>
</div>
<div class='cssLClearC'></div>
</div>
</div>
<div class='cssLO index_row_3_layout'>
<div class='row_3 cssLI index_row_3_design'>
<!-- row_3 Content Starts Here -->
&nbsp;
<!-- row_3 Content Ends Here -->
</div>
</div>
<div class='cssLClearR'></div>
</div>
</div>
<div class="cssLClearL"></div>
<!-- #index (CSSLayouts End) -->
</div>
</body>
</html>

teedoff
08-03-2011, 03:22 PM
DW doesn't position anything automatically if you're working in code view. To tell the truth, I dont know of any time I've had an element get automatically positioned since I've been using DW, code view OR design view. But as Dan said, you should be able to edit any style rule in the CSS style panel.



What should I be selecting instead of absolute positioning to keep the images, text from shifting in certain browsers?

Depends on what your desired outcome is. As someone already asked, do you have a live link to your site?

xxnonamexx
08-03-2011, 04:45 PM
I posted the code I do not have a live link.
Header: The template I am going for is a header with just an image which includes logo, hours, address,
Content: (varies) but first page 3 images with text below it.
Footer: copyright info

I hope this helps. I will try to post code in Dropbox to create a link

xxnonamexx
08-03-2011, 04:52 PM
I created 2 other websites using DW and they appear fine: http://anthonysdeli.com/ http://www.maidinwestchester.com/ with position:absolute. IE9 is killing it which is why I want to correct it so I can complete it.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum