How to center page in Split and Design view?

When I look at my template in Design or Split View, it is flush right on my screen with a top margin of 20 px or so. But when I check it in Live View, or when I preview it on Firefox/Safari/Chrome/Opera, it is centered and flush against the top of the screen.
I should add that the template was fine in Design and split, until I started mucking about the a spry menu. My page fell apart, I deleted the spry with plans ot start over. But then I discovered my template flush right (in Design and Split, anyway).
Can anyone please tell me how to correct this? I suppose it's more of a nuisance than a tragedy, as long as the page is centered when it goes online. But it is a nuisance to work on the right side of the screen.
Coding follows:
    margin-top: 0px;
    margin-left: 0px;
#wrapper {
    background-image: url(../template%20images/mainBody.jpg);
    background-repeat: repeat;
    overflow: hidden;
    width: 800px;
    background-color: #CCC;
    margin-right: auto;
    margin-left: auto;
#wrapper #header {
    height: 150px;
    width: 800px;
    background-color: #CCC;
    background-image: url(../template%20images/header.jpg);
#wrapper #navBar {
    height: 55px;
    width: 800px;
    background-color: #666;
    background-image: url(../template%20images/navBar.jpg);
#wrapper #mainBody {
    width: 80%;
    margin: 0 auto;
    padding-top: 20px;
    font-family: Arial, Helvetica, sans-serif;
#wrapper #footer {
    background-image: url(../template%20images/footer.jpg);
    width: 800px;
    height: 60px;
    text-align: center;
    font-size: 16pt;
    clear: both;
<!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>2000_template</title>

<link href="../CSS/layout.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
</head>
<body>
<div id="wrapper">
<div id="header">
</div>
<div id="navBar">
</div>
<div id="mainBody">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam dolor libero, aliquam vitae scelerisque in, malesuada non neque. </p>
<p>Phasellus dignissim arcu eget velit posuere vel varius magna dapibus. Phasellus pharetra imperdiet nunc, vel interdum dolor fermentum id. Integer luctus mollis tempor. Nunc lacus urna, blandit sollicitudin cursus at, ultrices et erat. Sed rhoncus, ipsum vitae dictum scelerisque, diam felis euismod augue, a facilisis massa augue ut nibh. </p>
<p>Sed ac ante magna. Nulla consequat posuere ullamcorper. In interdum, elit sed tempor suscipit, quam mauris egestas justo, sed lobortis sem magna a mi. Etiam tincidunt fringilla sapien, congue condimentum augue adipiscing ut. Nam pretium egestas lacus in elementum. Vivamus eros erat, varius nec aliquam quis, congue at orci.</p>
<p>Vivamus eget felis purus, in porta tellus. Nullam ac orci eu arcu luctus ornare. Aliquam quis ligula metus. Morbi congue cursus justo, et sagittis sem adipiscing blandit. </p>
<p>Quisque sed bibendum nisi. Curabitur ultrices imperdiet lacus in ullamcorper. Etiam pulvinar magna et neque congue eu aliquam metus semper. </p>
</div>

<div id="footer">
<p> ‹ ‹ Previous    1 :: 2 :: 3 :: 4    Continue › ›</p>
</div>
</div>
</body>
</html>

Get rid of this.
margin-top: 0px;
margin-left: 0px;
The universal selector (asterisk) applies whatever styles you give it to EVERY PAGE ELEMENT regardless of where it is. So unless you know exactly what you're doing, don't use universal selectors.
To center your page
body {
width:900px /**some width in pixels, ems or %}
margin:0 auto;
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Similar Messages

How to assign pages to workset and workset to roles in ep5sp6

hai,
how to assign pages to workset and workset to roles
in ep5sp6 . can any one help me in this regard .
Regards
praveen

Hi Praveen,
You can find the documentation you are looking for on the SAP help portal. This link will take you to the Administration Guide for EP5 SP6.
http://help.sap.com/saphelp_ep50sp6/helpdata/en/38/76bd3b6e74d708e10000000a11402f/frameset.htm
In the left hand navigation you can pick the topics that you are interested in. e.g. pages, roles, iviews.
Hope this helps.
John

Is it possible to have the same Split Code/Design view in CS5 that I had in CS3?

I am not a hard coder. However, like HTML, I could easily edit PHP in CS3 Dreamweaver's Split Code/Design view. It was more designer friendly, intuitive, etc. I could see/edit/move tables, placed graphics, text, etc. CS5 doen't allow me to see my PHP pages this way. Can this be fixed to have the same Split Code/Design view? I would appreciate any assistance you can offer.

To restore the cs3 style horizontal split of code and design views, go to the 'view' drop down menu and untick 'split vertically'.
Richard

Problem with code and design view

When I try to have both the code and design view
side by side in Dreamweaver CS4 on a PC -- I get the html code in both sections.
How do I see the layout while looking at the code?
Thanks for help.
Library Friend

You've probably got View > Split Code checked.
Click View > Code and Design

How to center the content in crystal report viewer?

open crystal report viewer in winform, default at the left top
after maxmium the winform window, content become at the center
another odd thing is that i set window winform size 1208*1024 and crystal report view is fill
then tried, content is not center any more
How to center the content in crystal report viewer in code?
Edited by: Mathew_666 on Oct 6, 2011 5:20 AM

Since there is no control for center you'll need to do the math on your own. This is just a rough draft, but you'll get the idea.
One of the things you'll need to figure out is your buffer to help you give a centered feel. We'll say that value is 50 in this case.
Height
int buffer = 50;
int formHeight = 1000; // we'll assume a height of 1000 in this case
int crystalTop = buffer;
int crystalViewerHeight = formHeight - (buffer * 2); // buffer is at the top and bottom
Width
int formWidth = 1000; // we'll assume a width of 1000 in this case
int crystalLeft = buffer;
int crystalViewerWidth = formWidth - (buffer * 2); // buffer is at the top and bottom

Combined code and design view broken

I use Dreamweaver MX 2004 and normally work in the "split"
(code and design) view. I just opened a site to work on it and that
mode does not work - I click on the link in the toolbar, but it
does not take effect. I also cannot make it work from
View-->Code and Design. The individual Code and Design views DO
work so I suspect it's a configuration problem. I checked
Edit->Preferences->Filte Types/Editors, and .html is not
listed in the "open in code view" dialog box. What would cause this
feature to suddenly stop working? I've Googled every conceivable
keyword and phrase to find an answer, without success. Has anyone
else experienced this behavior?

Never mind - figured it out. Duh, do I feel like a dummy! I
had apparently dragged the bottom border of the code window all the
way down, so the design view was hidden. Sorry!

Dreamweaver Momentarily Freezing When Moving Between Code and Design View

I have Dreamweaver CS4 and have had a problem that just started yesterday. I have rebooted my machine to no avail. The local copy and the live copy of the site are on two different servers that we access through a local network.
Dreamweaver slows to a standstill if I click to another program and then attempt to go back into Dreamweaver or if I switch between design and code view.
I haven't made any changes to Dreamweaver in the way of added extensions or updates. Is it possible that the cause of this could be either a server problem or a connectivity to the server problem?
Many thanks in advance for any help you could provide.
Andy

You can use CTRL+# to switch between Code and Design View.
By the way, this is the Dreamweaver Application Development forum which deals with questions about using server-side scripting languages like PHP or ColdFusion. General Dreamweaver questions should be posted in the regular Dreamweaver General Discussions forum.
And while I´m at it: please use descriptive headlines such as "how to switch between Code and Design View" for your posts -- mentioning your screen name "Goula129" is not helpful to other users.

How can I center pages for browsers and screen rez

Hi.
I purchased an html template web site. Im trying to have the
pages center themselves depending on the screen , resolution and
perhaps the type of browser it will be viewed in. Right now it just
shows up to the right hand side. This goes for all the pages in the
template.
here is the link for the site
Sample page
Im ok with Dreamweaver, no experience with CSS.
Thanks

Asked and answered here almost daily. You can find all the
info you need
starting here:
http://groups.google.com/groups?as_q=center+page&num=10&scoring=r&as_epq=&as_oq=&as_eq=&as _ugroup=macromedia.dreamweaver&as_usubject=&as_uauthors=&lr=&as_drrb=q&as_qdr=&as_mind=1&a s_minm=1&as_miny=1981&as_maxd=21&as_maxm=10&as_maxy=2008&safe=off
WARNING: This requires CSS code so it's time to step up.
Without
understanding HTML & CSS you will be very limited in what
you can
accomplish.
Walt
"mannsma" <[email protected]> wrote in
message
news:gdlo8u$ef$[email protected]..
> Hi.
> I purchased a html template web site. Im trying to have
the pages center
> depending on the screen , resolution and perhaps the
type of browser it
> will be
> viewed in.
>
> here is the link for the site
>
> https://filmlesscafe.com
>
> Im ok with Dreamweaver, no experience with CSS.
>
> Thanks
>

Help! Split and Design modes in Dreamweaver CS5 is disabled.

The first time I launched Dreamweaver CS5 I didn't like the default code / design view my files appeared in. So I choose a preference setting where files appear in a single pane in code view. Unfortunately I don't remember where this setting is located. I'm not sure if this is the culprit but I somehow lost the ability to toggle Split, Design, Live Code, Live View, and Inspect on any web file (.html, .htm, .asp, etc.). Could someone help me figure out how to enable these modes?

I am having the same problem, except the solution suggested by John Waller isn't working for me.
I opened a .css file and was prompted by a suggestion above the code/design windows stating "Inspect mode is most useful with certain workspace settings." and I clicked the "Switch now" option to which I was trapped in a code only mode without the option to edit anything other than css!
Please help.
Best,
Nela

How to print page in front and back in scripts

hi,
I want to know to know the how to print a page in front and back.

HI Ragavendra
set this
<b>Print mode is D</b>
With Print mode, you can specify single- or double-sided printing for a page. You can choose from the following values:
<b>D </b>The page is printed on the first side of a sheet in duplex mode. If another mode was previously active, then the printer is switched to duplex mode with the start of the pageand continues in this mode.
and other Print mode options are
<b>Print mode</b>
With Print mode, you can specify single- or double-sided printing for a page. You can choose from the following values:
<b>' '</b> Currently active printing mode continues unchanged.
<b>S </b>The page is printed in simplex mode. That is, the printer should print on only one side of the paper. If another mode was previously active, then the printer is switched to simplex mode with the start of the page.
<b>D</b> The page is printed on the first side of a sheet in duplex mode. If another mode was previously active, then the printer is switched to duplex mode with the start of the pageand continues in this mode.
<b>T </b>The page is printed on the first side of a sheet in tumble duplex mode. That is, the printer prints on both sides. The page on the second side is always inverted, so that the footer of the second page is printed opposite the header of the first page.
If another mode was previously active, then the printer is switched to tumble duplex mode with the start of the page and continues printing in this mode.
Print modes are currently supported for printers that use the PCL-5 language. These are printers that are defined with the following SAP device types: HPLJ_II, HPLJIIID, HPLJ4, LX4039, SNI20XX8.
See the spool system (transaction SPAD) to check on how your printers are defined.
The print controls for these functions are SPMSI (begin simplex printing); SPMDU (begin duplex printing); SPMTU (begin tumble duplex printing); SPMFS (print on first side of sheet in duplex or tumble duplex mode); and SPMBS (print on second side of sheet in duplex or tumble duplex mode).
Regards Rk

How to center page in Pages

Hey im used to the word templates and i dont like how the actual page in Pages is aligned to the left, how would i get it in the middle?

I think what you all are saying is a blank document opens to the left side of the screen and that you'd prefer it to open in the middle. Right?
If so, I've never thought much about it. Where windows open is part of the human interface guidelines. You can read some of that here.
Pages may not completely adhere to the letter of the link above but it seems there's a reason: it leaves space for inspectors. So, when a window opens, the window is slightly to the left because you open inspectors and they go in the space to the right. I don't remember the default - if inspectors open the first time you use Pages - but the logic is clear.
This is coded. I suppose ou could move the window, make an applescript - e.g., record one in Automator - and apply it each time you open Pages. Or you could drag the window anywhere you want, which is what almost everyone does without thinking.
The Mac desktop metaphor is slightly different from the Windows metaphor. With Windows, which I've used extensively, you tend to minimize, maximize and switch from application to application, document to document in either full screen or minimized. The Mac metaphor is more like a real desktop on which you can have a bunch of documents from a bunch of applications all available at the same time, overlapping, etc. (BTW, I suggest using Spaces to organize work.)

Why does my page look great in design view and to the left in live view?

I just created a new page using a fluid grid layout and in "design" view it looks great but in "live" view or on a browser preview the wording all goes to the left. What I am doing wrong? I also have another question which may relate to the first. I have four templates. Do I create a new named .css file for each new template or continue using the same layout.css file for all templates? Since I created a new .css file for every template maybe it is causing confusion. Thanks in advance.

If this is what you want, rework your HTML so all three images are in the same div and adjust your css to narrow the scroll down image and on Order jpg, vertically align top, 30px margin.
<div id="header">
<div id="pic1">
<img src="Thumbs/Scroll-Down.jpg" alt="More Pictures">
<img class="goldborder" src="NewImages/englilshivymain.jpg" alt="">
<a href="#OrderHere2">
<img alt="Order Here" src="Thumbs/OrderHere.jpg">
</a>
<br>
English Ivy (Detail)
</div>
<div id="pic4">

My pages are missing in design view ?? but not in live view?

I am using win 7 & DW5. I have not used DW% for more than a week. I need to update today and there is no page to work with? I don't know what to do? [email protected]

I have two sites up and running ... www.latheart.com and ... svwoodturners.org. Both are ok. This past weekl I installed chrome !@#$%^! didnot like it so I uninstalled it !@#$%^&! What a mess that caused. Some of the reg files had to be rewritten in the regesters also my photos also do not open automatically any more. The fonts were changed in almost everything. I think I have fixed most everything and then I found this problem with DW5. I do not know it that is related or how the htmls could even be affected. But both of my sites have the same issue. They will not dysplay in design view ..... Thanks for any help or suggestions. Rich Johnson San Jose Ca.
I don't know how to enter the code here ... I have cut and pasted and it creats the page with out the photos.
<!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>The Brickyard RR</title>

<style type="text/css">
body {
background-image: url(images/Trains/ballest.jpg);
#title {
height: 250px;
width: 950px;
margin-right: auto;
margin-bottom: 5px;
margin-left: auto;
border: medium solid #F90;
position: relative;
#navbar {
height: 35px;
width: 950px;
margin-right: auto;
margin-bottom: 5px;
margin-left: auto;
border: medium solid #F90;
position: relative;
padding-left: 0px;
padding-top: 3px;
background-color: #FDFDDB;
#main {
height: auto;
width: 950px;
margin-right: auto;
margin-left: auto;
border: medium solid #F90;
position: relative;
background-color: #fdfddb;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
#main h2 {
text-align: center;
font-size: larger;
</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />

<style type="text/css">
#main p a img {
border: medium solid #F90;
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 40px;
</style>

</head>
<body>
<div id="title"><img src="images/Trains/traintitle.jpg" width="950" height="250" alt="title" /></div>
<div id="navbar">
<ul id="aboose" class="MenuBarHorizontal">
    <li><a href="rrindex.html" class="MenuBarItemSubmenu">RR Home</a>
      <ul>
        <li><a href="rrabout.html">About</a></li>
</ul>
    </li>
<li><a class="MenuBarItemSubmenu" href="rrstart.html">Our Story</a>
      <ul>
        <li><a href="rrfriends.html">Friends</a>        </li>
        <li><a href="rrpower.html">Power</a></li>
        <li><a href="rrmeanwhile.html">Track</a></li>
        <li><a href="rrmore.html">More Track</a></li>
        <li><a href="rrready.html">Ready</a></li>
      </ul>
    </li>
    <li><a href="rropenhouse.html" class="MenuBarItemSubmenu">Open House </a>
      <ul>
        <li><a href="rrsanjose.html">San Jose</a></li>
      </ul>
    </li>
    <li><a href=" " class="MenuBarItemSubmenu">Roster</a>
      <ul>
        <li><a href="rrmotivepwr.html">Motive Power</a></li>
        <li><a href="rrrollingstock.html">Rolling Stock</a></li>
        <li><a href="rrpassenger.html">Passenger </a></li>
        <li><a href="rrcaboose.html">Cabbose</a></li>
        <li><a href="rrcaboose.html">M. O. W.</a></li>
      </ul>
    </li>
</ul>
</div>

<div id="main">
<h2>Our Track Plan </h2>
<p><a href="images/Trains/trackplan.jpg"><img src="images/Trains/trackplan.jpg" width="850" height="668" alt="trackplan" /></a></p>
<h2>Our Yard</h2>
<p><a href="images/Trains/backyard.jpg"><img src="images/Trains/backyard.jpg" alt="yard" width="850" height="575" /></a></p>
<h2> <a href="rrstart.html">Follow along on a journey through the creation of the Brickyard Garden Railroad</a></h2>
<h2><a href="rrindex.html">Back to the top of the page</a></h2>
<p> </p>
<h2><a href="tindex.html">Woodturning</a></h2>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("aboose", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>

JDeveloper 10.1.3.2.0 - How to see content of showDetailItem in Design View

Hello,
I am new to use the JDeveloper to create JSF Applications and I learn with the tutorials.
So I have a question:
I want to find out: How to see the content of the second or third showOneTab component in the WYSIWYG Design View of a page.jspx?
For example, I am orientating the tutorial: "Introduction to ADF Faces/Trinidad Using JDeveloper" (http://www.oracle.com/technology/obe/obe1013jdev/10131/trinidad/adf_faces_trinidad.htm)
Page: table.jspx
There is the showOneTab "Single Row Select" and "Multi Row Select" and I see only the content of "Single Row Select".
How can I see the content the table2 of "Multi Row Select".
I have created the table of "Single Row Select" and can see only this one.
The download of that example show me in the View of structur the component table2, but not in DesignView.
Can you help me?
best regards
Joachim

Hello Frank,
many thanks for your answer. It try it and it works!
For completion, I think the argument "disclosed" of the component "af:ShowDetailItem" with "default" setting is "false".
So if I will editing one tab in WYSIWYG editor, I set only this tab disclosed = true.
All others to "false". When my edit is completed, I set only the first tab to "true" and all other "false", because I want to start with the first tab by first request.
I look again into the "help". Hopefull in answer:
Which effect has this argument by deployment?
There is only the desciption: "whether or not to disclose the children This attribute is not supported on the following agent types: pda, phone, voice."
I think this is for me irrelevant. My application have to support only a client like a personal computer.
Which effect has this argument by deployment?
Or is this only for the WYSIWYG editor?
Joachim

Dreamweaver SPLIT CODE/DESIGN VIEW?

Hello.
I'm running Dreamweaver CS3. I have dual 22" monitors and I
want to be able to see the design view and code view of a single
page at the same time vertically not horizontally. Right now when I
hit the SPLIT the windows are on top of each other. Is there a way
to make them beside each other or apart or something?
I also tried running two instances of Dreamweaver but that
didn't work either. This really sucks because I want to be able to
see my full design while I edit the code/css.
Thanks

WebMan4 wrote:
> Is there any other way around this?
Not that I know of.
More people are using large monitors and dual monitor setups
these days,
so vertical split view is a feature that is likely to be
increasingly
requested. Why not submit a feature request to the
development team?
http://www.adobe.com/cfusion/mmform/index.cfm?name=wishform
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS3" (friends of
ED)
Author, "PHP Solutions" (friends of ED)
http://foundationphp.com/

How to center page in Split and Design view?

Similar Messages

Maybe you are looking for