Whole Page Refreshes while Navigating between Pages

Hi ,
I am using Jdev 11.1.1.6 and I tried to implement a custom template with custom navigation in the template. Below are the details :
1) Created a Template with navigation links on the left side .
2) Added the Default Navgation links as follows :
*<af:forEach var="node" varStatus="vs"*
*items="#{navigationContext.defaultNavigationModel.listModel['startNode=/, includeStartNode=false']}">*
*<af:goLink id="pt_gl1" text="#{node.title}"*
*destination="#{node.goLinkPrettyUrl}"*
*targetFrame="#{node.attributes['Target']}"*
*inlineStyle="font-size:small;#{node.selected ? 'font-weight:bold;' : ''}"/>*
*<af:spacer id="sp1" width="20px"/>*
*</af:forEach>*
3) I was able to display the content and the links and all the links are displaying the corresponding data in the content facet .
But when I click on any of the links the whole page is refreshing. Could you please let me know how can i make only the facet to refresh instead of whole page .
Thank you,
Sashank P

It's normal that when you are using an af:goLink the entire page is refreshing. An af:goLink is just a normal hyperlink.
That is normally the recommended case for a portal where you want robots to index your portal properly.
If you really want to use PPR you have to use a commandButton instead. There is an example of that code in the normal portal template when you create a new webcenter portal application. Just copy that part and you should be fine.
Edited by: Yannick Ongena on Apr 15, 2013 9:06 AM

Similar Messages

  • How to remove white fade while navigating between pages?

    I created small web page with 4 buttons which each of them leads to other page eg., Home,Gallery, Contacts,Reviews, but when i'm navigating between them there is annoying white flash! Is it possible to remove it?
    P.S. I uploaded my site to businesscatalyst Home
    Thank you!

    That is so strange, I just tried on my OS X Safari and WIN 7 Chrome and everything just fine, but when I'm trying on same OS X Chrome it has white flash while transitioning through navigation. Thanks anyway mac_heibu!

  • Page zoom not holding between pages in FF4

    Back in good old FF 3 page zoom would hold between pages or on refresh, I am finding with FF4 every time I reload a page or click a link to a different part of the same website I need to re-size the page, as I use FF for its zoom function this is starting to get a bit frustrating, anyone know how to fix it?
    Much appreciated

    Make sure that you not run Firefox in (permanent) [[Private Browsing]] mode.
    * You enter Private Browsing mode if you select: Tools > Options > Privacy > History: Firefox will: "Never Remember History"
    * To see all History and Cookie settings, choose: Tools > Options > Privacy, choose the setting <b>Firefox will: Use custom settings for history</b>
    * Uncheck: [ ] "Permanent Private Browsing mode"

  • Navigation between pages

    Dear All,
    A few days ago i started to work with webcenter portal and i have a problem:
    My use case:
    I have 2 pages(both based on default template), each of them contains single task flow with single page fragment:
    page1 - contains task flow tf1.xml with page fragment view1.jsff
    page2 - contains task flow tf2.xml with page fragment view2.jsff
    I need to navigate between this 2 pages with custom buttons(or links) which have to be created inside page fragments.
    I added both pages to default-navigation-model.xml and after running the application i am able to navigate between them using links, which template creates dynamiclly(taking all the default-navigation-model's content into iterator and creating navigation links on page load).
    The code from template file(skipping the iterator):
    <af:commandLink id="pt_cl1" text="#{node.title}"
    inlineStyle="font-size:small;#{node.selected ? 'font-weight:bold;' : ''}"
    action="pprnav"
    disabled="#{not node.navigable}"
    actionListener="#{navigationContext.processAction}"
    clientComponent="#{node.attributes['Target'] == '_popup' ? true : false}">
    <!-- pass node to processAction for setting current selection and navigation -->
    <f:attribute name="node" value="#{node}"/>
    all this works just fine.
    Now i need to create a button in my view1.jsff(page fragment from first task flow on page1) , which would navigate me to my second page.
    I am able to do this with goLink setting
    navigate="#{naviagtionContext.defaultNavigationModel.node[page2].goLinkPrettyUrl}", but this reloads the whole template what i don't need, and also i would like to add some actionListener to this link or button later so i need to navigate using commandLink or commandButton.
    The example from page template doesn't work for my pages:
    My commandLink looks like this:
    <af:commandLink id="pt_cl1" text="Go page 2"
    action="pprnav"
    actionListener="#{navigationContext.processAction}"
    clientComponent="false">
    <f:attribute name="node" value="#{navigationContext.defaultNavigationModel.node['page2']}"/>
    </af:commandLink>
    but second line - action="pprnav" throws some empty screen and nothing else happens(guess it's because there is no partial page refresh in this case).
    Without this line it works, i was able to insert some output text fields in my page and see, that the value of
    #{navigationContext.defaultNavigationModel.currentSelection.title} is changing properly(when i removed the action="pprnav" line, of couse without it navigation itself does not happen).
    If i drop taskflows into my default-navigation-model.xml, skipping the pages action="pprnav" work fine(no empty screens appear and navigation happens), but i need to use the pages.
    Is there any replacement to action="pprnav", to be able to navigate between these two pages?
    Or may be there is another method to do this, which i couldn't find in Google?
    BR,
    Artur

    It's an old thread, but I keep running into this issue every now and then.
    The clue is:
    Any task flow that uses the navigation model to trigger navigation within an application must include a parent-action activity named "wcnav_parentAction" in the task flow definition that propagates the "wcnav_outcome" to the root level, as follows:
    <parent-action id="wcnav_parentAction">
    <root-outcome>wcnav_outcome</root-outcome>
    </parent-action>
    See the following Support note:
    Invoking A WebCenter Page From ADF Taskflow Failing In WebCenter 11.1.1.6 and Opens an Empty Popup Window [ID 1450568.1]
    Jaap

  • While navigating the pages in Menu Not showing correct jspx

    Hi ,
    We develop 10 ADF Pages and attached those pages to Menu . Now while going to page A its not showing pagA.jspx in address Bar ( though its showing correct Page ) But when navigating to PageB
    its showing PAgeA.jspx in ( Address Bar ) but its showing correct pageB content . Why this behave like this ...??
    Edited by: [email protected] on Jul 22, 2009 9:15 AM

    This is not an ADF issue - this is a core JSF way of working.
    Why would your end user care about the address anyway?
    You can set your navigation case to be redirect to get around this.

  • Issue in navigation between pages

    Hi,
    I am working on developing the checkout flow of an e-commerce site. The first page (say page A)is the checkout collects the required user input. If the input is valid the user is taken to the confirmation page(say page B). Both these pages share a managed bean.
    My issue is, when the user completes his first successful flow, and shops the second time and does a checkout, the pageA is not shown. He is directly taken to pageB.
    I would like the pageA to be shown when the user comes for the sesond time in the same session.
    My faces-config.xml looks as follows.
    <faces-config>
    <managed-bean>
    <description>Checkout Bean</description>
    <managed-bean-name>checkoutBean</managed-bean-name>
    <managed-bean-class>ui.checkout.beans.CheckoutBean</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
    </managed-bean>
    <navigation-rule>
    <from-view-id>*</from-view-id>
    <navigation-case>
    <from-outcome>modifyPreference</from-outcome>
    <to-view-id>/view.jsp</to-view-id>
    </navigation-case>
    <navigation-case>
    <from-outcome>confirmOrder</from-outcome>
    <to-view-id>/orderConfirmation.jsp</to-view-id>
    </navigation-case>
    </navigation-rule>
    </faces-config>Please help me in solving this.
    Thanks in Advance.
    Regards,
    Raja

    I am able to sort out the usage of passing non-visible properties using t:saveState.
    However my original issue of the user not being able to see the default view still remains. My updated faces-config navigation rule looks as follows.
       <navigation-rule>
          <from-view-id>*</from-view-id>
          <navigation-case>
             <from-outcome>modifyPreference</from-outcome>
             <to-view-id>/view.jsp</to-view-id>
          </navigation-case>
          <navigation-case>
             <from-outcome>confirmOrder</from-outcome>
             <to-view-id>/orderConfirmation.jsp</to-view-id>
          </navigation-case>
          <navigation-case>
             <to-view-id>/view.jsp</to-view-id>
          </navigation-case>
       </navigation-rule>All I need is, when the user goes to orderConfirmation.jsp and in the same session if he tries to buy more products and does a checkout he should be taken to view.jsp rather than orderConfirmation.jsp.
    Any help is highly appreciated.
    Thanks in advance.
    Regards,
    Raja

  • Passing data while navigating across pages

    I have a registration page across more than 6 pages.
    which is splited as personal details, contact details etc...
    I have to store the data as user enter details each page.
    But should save the data to database after completion of last page.
    How to do we maintain data enterred across pages?
    Hope this clarifies. Waiting for earliest reply.
    thanks
    Regards
    priyaps

    That answer has to be one of the worst I have seen.
    All the data in the request object at the end? What dreamworld do you live in?
    The request parameters only last for one request. Every time you submit a page, you send a new request.
    In order to retain state over multiple requests you need to use the Session.
    Best way to do it is to create a java bean that will encapsulate all the data you need to enter across all the forms. Making it a session bean means that all its values will be retained on the server.
    One by one, as you submit the pages, put the values entered on the form, into the bean. If you need to go back a step, you can retrieve the data from the bean to repopulate the form.
    At the end, all of the data is stored in your session bean.
    Then you can write a method which saves the values in your bean to the database

  • CS5.5 page palette - , instead of - between pages

    Hello,
    I am a newbie.
    I made a masterpage A-PL (see also inserted figure). I inserted a new page before page 2 and in the tool palette there is a "," instead of a "-" between page 1 and 2.
    I already copied the text (great table with cross-references), inserted a new "empty" page based on A-PL master page and then I also saw that there was no link between the new page (1) and the second page. I manually added the link between the 2 pages. Strange that there is no automatic link between these 2 pages. On the Masterpage A-PL there is an link between the left and the right side.
    I hope that someone can help me.

    Normally, we work with Framemaker. The first page of the body text in the book file must start Left. In indesign is that not possible. There is an procedure to start it left (add a page before the page that must start left, disable "allow document pages to shuffle", delete the inserted page, and then the page (who first started at right, will start at left)).
    I did this procedure but I remarked that there is a "," on the marked blue pages in the capture instead of a "-".
    It was also strange that when I inserted the blank page with the same section numbering and same master page setting, the link between these pages where gone. I have to set the link manually.
    I hope it is clear now...

  • Page size keeps changing between pages based on browser zoom

    I recently started designing a web page for a golf league.  I designed my main page (index.html) and have it laid out all nice and neat with 9 divs (outer, wrapper, logo, social media, topnav, banner, content, rightside, footer).  My main page has horizontal navigation links near the top of the page for 7 different pages (Home, Course, Events, History, Statistics, About, Contact).  I created 6 blank html files for the other 6 pages and then created and applied the template from my main (Home) page to the other 6 pages. 
    All the pages are laid out perfectly and everything seems fine.  However, when I view the web pages and use the zoom on my mouse (CTRL + Mousewheel), it only remembers the zoom level for the current page that I'm on.  NOTE: FYI, I'm viewing all of these pages offline, which I assume might be the problem.
    For example, if I'm on my main page and zoom in, then click the "Events" link, it switches to the Events page, but doesn't have the same zoom level.  These zoom levels also seem to be saved (to my browser, not the dreamweaver code), because when I close the browser and reopen it to the web page, it remembers the previous zoom settings.
    I just started building a web page a few days ago and don't have a published web page as I haven't selected a host yet, but plan to when I know how what exactly I need in terms of size.  All the web pages I've been viewing are on my hard drive.  Is that why the zoom is not consistent across all my pages?  To clarify, if I zoom all the way in on my home page, then click "Events", the Events page won't necessarily be zoomed all the way in, it will be at the same zoom level as the last time I viewed it.
    I just want to know if this issue will go away when I actually publish my page to the internet and view it on the web?  If not, I'd like to tackle the problem now before I publish it because this site has to be professional since we're holding a big charity event in the fall with a major and well known charity and celebrity.
    Thanks in advance for any help!

    You're not using frames or framesets are you?
    In which browsers are you testing your site?
    My experience in Firefox, Chrome & IE9 is that Ctrl++ (zoom) remains constant until I change it.
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb
    http://alt-web.blogspot.com/

  • Mac OSX 10.6.8 - The whole system crashes while navigating in Soundcloud

    While navigating in soudcloud the whole system crashes and I have to force restart in my laptop (Macbook pro 2010)
    Back to Safari?

    We're sorry to hear that Firefox is crashing when you open it. Please do the following to give us crash IDs that will help us understand more about the crash.
    #'''(OS X 10.6 or previous)''' Click the '''Finder''' icon in the dock. Your home folder will be selected. In the right side of the window, click the Library folder to open it. Then open the "Application Support" folder, the "Firefox" folder, the "Crash Reports" folder and finally the "submitted" folder.<br>'''(OS X 10.7 or above)''' Click the '''Finder''' icon in the dock. On the menu bar, click the '''Go''' menu, hold down the '''option''' or '''alt''' key and select '''Library'''. A window will open containing your Library folder. Then open the "Application Support" folder, the "Firefox" folder, the "Crash Reports" folder and finally the "submitted" folder.
    #Open the 5 most recent files with a text editor and copy the IDs.
    #Paste each ID with '''bp-''' into the reply window on the forums.
    Thanks in advance!
    You can find more information and troubleshooting steps in the [[Firefox crashes]] article.

  • Page hangs While Navigating from JTT to OA

    In our product Oracle Trade Management we are facing the following issue while trying to navigate to an OA page from a JTT page. Please note that the page hangs for sometime and we have noticed following exception:
    java.lang.RuntimeException: java.sql.SQLException: Missing descriptor
    at oracle.apps.jtf.base.session.JTFCDB.getJTFCookieString(JTFCDB.java:414)
    at oracle.apps.jtf.base.session.JTFCookie.getBrowserCookie(Unknown Source)
    at
    oracle.apps.jtf.base.session.ServletSessionManager.addSessionCookie1(ServletSe
    ssionManager.java:4240)
    at
    oracle.apps.jtf.base.session.ServletSessionManager.addSessionCookie(ServletSes
    sionManager.java:4211)
    at
    oracle.apps.jtf.base.session.ServletSessionManager.endRequest(ServletSessionMa
    nager.java:2495)
    at pages._jtfcrmchrome._jspService(__jtfcrmchrome.java:1894)
    at weblogic.servlet.jsp.JspBase.service(JspBase.java:34)
    at
    weblogic.servlet.internal.StubSecurityHelper$ServletServiceAction.run(StubSecu
    rityHelper.java:227)
    at
    weblogic.servlet.internal.StubSecurityHelper.invokeServlet(StubSecurityHelper.
    java:125)
    at
    weblogic.servlet.internal.ServletStubImpl.execute(ServletStubImpl.java:300)
    at
    weblogic.servlet.internal.ServletStubImpl.execute(ServletStubImpl.java:183)
    at
    weblogic.servlet.internal.RequestDispatcherImpl.invokeServlet(RequestDispatche
    rImpl.java:523)
    at
    weblogic.servlet.internal.RequestDispatcherImpl.forward(RequestDispatcherImpl.
    java:253)
    at weblogic.servlet.jsp.PageContextImpl.forward(PageContextImpl.java:159)
    at pages._jtfcrmchrome._jspService(__jtfcrmchrome.java:1312)
    at weblogic.servlet.jsp.JspBase.service(JspBase.java:34)
    at
    weblogic.servlet.internal.StubSecurityHelper$ServletServiceAction.run(StubSecu
    rityHelper.java:227)
    at
    weblogic.servlet.internal.StubSecurityHelper.invokeServlet(StubSecurityHelper.
    java:125)
    at
    weblogic.servlet.internal.ServletStubImpl.execute(ServletStubImpl.java:300)
    at
    weblogic.servlet.internal.ServletStubImpl.onAddToMapException(ServletStubImpl.
    java:416)
    at
    weblogic.servlet.internal.ServletStubImpl.execute(ServletStubImpl.java:326)
    at weblogic.servlet.internal.TailFilter.doFilter(TailFilter.java:26)
    at
    weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:56)
    at oracle.apps.jtf.base.session.ReleaseResFilter.doFilter(Unknown Source)
    at
    weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:56)
    at
    oracle.apps.fnd.security.AppsServletFilter.doFilter(AppsServletFilter.java:332
    at
    weblogic.servlet.internal.FilterChainImpl.doFilter(FilterChainImpl.java:56)
    at
    weblogic.servlet.internal.WebAppServletContext$ServletInvocationAction.wrapRun
    (WebAppServletContext.java:3715)
    at
    weblogic.servlet.internal.WebAppServletContext$ServletInvocationAction.run(Web
    AppServletContext.java:3681)
    at
    weblogic.security.acl.internal.AuthenticatedSubject.doAs(AuthenticatedSubject.
    java:321)
    at weblogic.security.service.SecurityManager.runAs(SecurityManager.java:120)
    at
    weblogic.servlet.internal.WebAppServletContext.securedExecute(WebAppServletCon
    text.java:2277)
    at
    weblogic.servlet.internal.WebAppServletContext.execute(WebAppServletContext.ja
    va:2183)
    at
    weblogic.servlet.internal.ServletRequestImpl.run(ServletRequestImpl.java:1454)
    at weblogic.work.ExecuteThread.execute(ExecuteThread.java:207)
    at weblogic.work.ExecuteThread.run(ExecuteThread.java:176)
    The sample code used in JTT page to build Hyperlinks, which takes us to OA page is give below:
    String l_strOfferNameHyperlink = oracle.apps.asf.util.FunctionUtil.getURL(omoPage,"OZF_FS_OFFR_UPDT")+"&qpListHeaderId="+l_strObjId;
    String l_StrPageIdsUrl = "&"+omoPage.getPageIDsURL().substring(1);
    l_strOfferNameHyperlink += l_StrPageIdsUrl;
    l_strOfferNameHyperlink += "&PAGE.OBJ.objType=OFFR";
    l_strOfferNameHyperlink = oracle.apps.jtf.admin.adminconsole.SideBarMetaData.getURL(l_strOfferNameHyperlink,0,0);
    We modified the code as per the OA dev guide and bug no: 04548959
    l_strOfferNameHyperlink = PageUtil.get(omoPage).getURLNoCookie("OZF_FS_OFFR_UPDT",false)+"&qpListHeaderId="+l_strObjId;
    String l_StrPageIdsUrl = "&"+omoPage.getPageIDsURL().substring(1);
    l_strOfferNameHyperlink += l_StrPageIdsUrl;
    l_strOfferNameHyperlink += "&PAGE.OBJ.objType=OFFR";
    l_strOfferNameHyperlink = oracle.apps.jtf.admin.adminconsole.SideBarMetaData.getURL(l_strOfferNameHyperlink,0,0);
    l_strOfferNameHyperlink = oracle.apps.jtf.base.session.ServletSessionManager.getURL(l_strOfferNameHyperlink);
    Pls let us know what is the better way to handle the navigation from JTT to OA to avoid this issue.
    Thanks,
    Nirma

    Calling OA Page from JSP page
    Call OAF Page from JSP
    -Anand

  • Firefox 5.0 locks up while navigating on page.

    Since upgrading to 5.0, when navigating on a page with my mouse, the arrow will freeze and my computer will lock up. I've tried waiting and half an hour. No change. I can only hit the reboot button.

    Doesn't work. Guess I'll need to switch Internet Explorer that although I don't care for the browser at least it can print without a problem.

  • Hiding the Region Navigating between pages

    Hi All,
    I have two regions in page1 ( region1 & region2), when I click one of the columns in page2 I should see only region2. I have searched in forum but I didn't find any solution for this kind of problem.
    How can I completely hide the region1 which is in page1? Is there any way that I can hide the region through conditional display
    Thanks,
    Suma.

    I assume the clicking is using a link to page 1. In that link you can specify an item on the page 1 and flag it with some value. In the conditonal display of the region on the page 1 you may specify to show it only if that flag is NULL.
    Denes Kubicek
    http://deneskubicek.blogspot.com/
    http://www.opal-consulting.de/training
    http://apex.oracle.com/pls/otn/f?p=31517:1
    http://www.amazon.de/Oracle-APEX-XE-Praxis/dp/3826655494
    -------------------------------------------------------------------

  • Module pool. error while navigating between tabs in tabstrip

    Hi all,
    in the module pool program, when i navigate from one tab to another it is giving me an error saying "Illegal value when compressing the screen". what might be the reason?
    Thanks

    Hi,
    Check out the dimensions of the subscreen. May be its bigger than your subscreen area.
    Regards,
    Naga Sai Swapna

  • Slightly shift between pages is driving me nuts.

    Hello,
    I've been building my site and I noticed that there is a slight shift in between all of the pages and the contact page, I have copy and paste several times the coding from one page to the other one... sometimes it shifts up and down, when navigating between pages. I was wondering if someone can figure this out. Here is the coding for you to look. The first one si the index which is the correct position for the spry menu, title to be in, the second one is the contact one which is the one that shifts.
    index:
    <!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>Works</title>
    <style type="text/css">
    img {
              background-color: #FFF;
              top: 10px;
              right: 10px;
    #pix p img {
              vertical-align: middle;
    #pix div #MenuBar1 {
              font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
    #footer div p {
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
              font-size: x-small;
    p {
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
              font-size: 14px;
    #about p {
              font-size: 9px;
    #about p {
              font-size: 12px;
    #about p {
              text-align: center;
    #about p {
              text-align: left;
    #pic01 {
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
              font-size: 10px;
              background-color: #FFF;
              letter-spacing: 0%;
              clear: none;
              float: none;
              height: auto;
              width: 500px;
              border-top-width: thin;
              border-right-width: thin;
              border-bottom-width: thin;
              border-left-width: thin;
              border-top-style: none;
              border-right-style: none;
              border-bottom-style: none;
              border-left-style: none;
              left: auto;
              clip: rect(auto,auto,auto,400px);
              padding-left: 0px;
              top: auto;
              right: auto;
              bottom: auto;
              margin-right: auto;
              margin-left: auto;
    #header .center {
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
              font-size: 36px;
    </style>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    body {
        font: "Trebuchet MS", Arial, Helvetica, sans-serif;
        width: 1000px;
        margin: 0 auto;
        font-size: 100%;
        background: #FFF;
    h1 {font-size: 36px;}
    #pix01 {
              width: 600px;
              border: 1px dotted white;
              margin-top: 0;
              margin-right: auto;
              margin-bottom: 0;
              margin-left: 260px;
              height: 595px;
    #pix01 img {
              height: 595px;
              width: 600px;
              vertical-align: middle;
    #pix01 p {
        font-size:12px;
    #footer {
        font-size:12px;
    /**re-usable classes**/
    .center {text-align:center}
    .right {text-align:right}
    /**clear floats**/
    .clearLt {clear:left; display:block; height:1px; visibility:hidden;}
    </style>
    </head>
    <body>
    <div id="header">
      <h1 align="center" class="center">Arturo Herrera</h1>
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li><a href="index.html">Home</a></li>
        <li><a href="Works.html">Works</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Dossier</a></li>
        <li><a href="Contact.html">Contact</a></li>
        <li><a href="#">Links</a></li>
        <li><a href="#">New Exhibitions</a></li>
        <li><a href="#">Video</a></li>
      </ul>
      <p>
        <!--clear floats in menu-->
      </p>
      <hr class="clearLt" />
      <p><!--end header--></p>
    </div>
    <div id="pix01"><img src="background2.jpg" name="main" width="600" height="595" id="main" /></div>
    <p align="center"> </p>
    <div id="pic01">
      <p align="left" class="text">Background # 2 Cut &amp; Paste 2/5</p>
      <p align="left" class="text">Mixed Media: magazine collage, glue, wood, photographic paper, matt board, nails,</p>
      <p align="left" class="text">plywood, wire, sylicon</p>
      <p align="left" class="text">tags: identity, citizenship, illegal immigrant, immigration, racial profile, status, canada,</p>
      <p align="left" class="text">usa, latino, home sexuality</p>
      <p align="left" class="text">2012</p>
    </div>
    <p align="center"> </p>
    <p align="center"><a href="https://www.facebook.com/arteisfoto" target="new" class="facebook">Facebook</a></p>
    <p align="center"><a href="http:/www.arteisfoto.com" target="new">Arte is Foto</a></p>
    <p align="center"> </p>
    <div id="footer">
      <div align="center">
        <p> </p>
        <p>Copyright 2002-2013 © Arturo Herrera. This is site is contantly changing.</p>
      </div>
    </div>
    <p> </p>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>
    Contact:
    <!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>Works</title>
    <link href="images.css" rel="stylesheet" type="text/css" />
    </head>
    <body><!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>Works</title>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    body {
        font: "Trebuchet MS", Arial, Helvetica, sans-serif;
        width: 1000px;
        margin: 0 auto;
        font-size: 100%;
        background: #FFF;
    h1 {font-size: 36px;}
    #pix01 {
    width: 480px;
    border: 1px dotted white;
    margin: 0 auto;
    #pix01 img {
        height: 130px;
        width: 130px;
        vertical-align:middle;
    #pix01 p {
        font-size:12px;
    #footer {
        font-size:12px;
    /**re-usable classes**/
    .center {text-align:center}
    .right {text-align:right}
    /**clear floats**/
    .clearLt {clear:left; display:block; height:1px; visibility:hidden;}
    </style>
    </head>
    <body>
    <div id="header">
    <h1 class="center">Arturo Herrera</h1>
    <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="index.html">Home</a></li>
      <li><a href="Works.html">Works</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Dossier</a> </li>
      <li><a href="Contact.html">Contact</a></li>
      <li><a href="#">Links</a></li>
      <li><a href="#">New Exhibitions</a></li>
      <li><a href="#">Video</a></li>
    </ul>
    <!--clear floats in menu-->
    <hr class="clearLt" />
    <!--end header-->
    </div>
    <p align="left" class="text"> </p>
    <p align="left"> </p>
    <p align="center" class="contact">If you would like to contact me please send me an email at: <a href="mailto:[email protected]">[email protected]</a></p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <div id="footer">
      <div align="center">
        <p> </p>
        <p>Copyright 2002-2013 © Arturo Herrera. This is site is contantly changing.</p>
      </div>
    </div>
    <p align="center" class="contact"> </p>
    <p align="center" class="contact"> </p>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
      </script>
    </body>
    </html>
    I hope this is something easy to fix, Thanks!! this is the website too : www.arturoherrera.ca

    arteisfoto wrote:
    John, I duplicated the rule pix01 to pix02 and assigned it to the next image and its working, would you say that is ok?
    It works but it's high maintenance using unnecessary, repetitive IDs for repeating page elements with the same CSS rules defined for each ID. There's lots of redundant CSS and you need a new ID defined for every image. That's creating a rod for your back.
    Convert to a class - that's what they're for - and you're done.
    Change
    #pix01 {
              width: 600px;
              margin-top: 0;
              margin-right: auto;
              margin-bottom: 0;
              margin-left: 260px;
              height: 450px;
    to
    .pix01 {
              width: 600px;
              margin-top: 0;
              margin-right: auto;
              margin-bottom: 0;
              margin-left: 260px;
              height: 450px;
    Change all
    <div id="pix01">
    to
    <div class="pix01">
    and you're done.
    Note: there's even a school of thought which says IDs in CSS can be avoided altogether.
    http://screwlewse.com/2010/07/dont-use-id-selectors-in-css/

Maybe you are looking for