Dw8 template breaks in cs3
First of let me state that I don't like nested
templates......... I have been using DW8 to do the template work...
it validates the css and the html in the w3c validator, ( i
also have to make it accessible) , i also validated it in cs 3
which it validates... it looks fine on the web, and in DW8, but not
in cs3.... is there a reason the divs are breaking and going all
over the place? is there any bugginess I need to be aware of? (i
didn't find anything yet)
The reason we use nested templates is there are 8 or more
people working on the web, there web exp. is
greatly varying and I have enough trouble trying to keep up
with them not overwriting work (even with a message pooping up
saying it is checked out..) The problem is most of them don't do
code and they really can't make changes because of the way the divs
are all over the place.... when i detach the template however
everything is perfect... as far as I know it doesn't lose any code
when detached..... If I need to be more specific plz let me
know...
Let's see the page.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"jbmarlow" <[email protected]> wrote in
message
news:g279v1$iem$[email protected]..
> First of let me state that I don't like nested
templates......... I have
> been
> using DW8 to do the template work...
> it validates the css and the html in the w3c validator,
( i also have to
> make
> it accessible) , i also validated it in cs 3 which it
validates... it
> looks
> fine on the web, and in DW8, but not in cs3.... is there
a reason the divs
> are
> breaking and going all over the place? is there any
bugginess I need to be
> aware of? (i didn't find anything yet)
>
> The reason we use nested templates is there are 8 or
more people working
> on
> the web, there web exp. is
> greatly varying and I have enough trouble trying to keep
up with them not
> overwriting work (even with a message pooping up saying
it is checked
> out..)
> The problem is most of them don't do code and they
really can't make
> changes
> because of the way the divs are all over the place....
when i detach the
> template however everything is perfect... as far as I
know it doesn't lose
> any
> code when detached..... If I need to be more specific
plz let me know...
>
Similar Messages
-
PLEASE HELP - Problem with 2 column fixed template in Dreamweaver CS3
I am trying to create a website using the 2 column fixed, right sidebar, header and footer html template in Dreamweaver CS3. I tried putting a picture in the right side bar as well as with in the main content or left portion of the page, and neither picture is showing up when I view it in any of the browsers I'm using.
I've made some minor changes in colors and sizing, but other than that no other changes. The pic I put in for the header is showing up just fine though.
Any help or advice to solve this issue would be greatly appreciated.
Thanks!!Here is the base Dreamweaver code including the pic references that I'm trying to show on either side - when the browser opens, it only shows a blank space where the pics should be... let me know what you think. Thanks!!
<!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"><!-- InstanceBegin template="/Templates/AL TemplateNEW.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Temp Home</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<!-- InstanceEndEditable -->
<style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
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;
.twoColFixRtHdr #container {
width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
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. */
.twoColFixRtHdr #header {
background: #DDDDDD;
padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
.twoColFixRtHdr #header h1 {
margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
.twoColFixRtHdr #sidebar1 {
float: right; /* since this element is floated, a width must be given */
width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
background: #EBEBEB; /* the background color will be displayed for the length of the content in the column, but no further */
padding: 15px 10px;
.twoColFixRtHdr #mainContent {
margin: 0 250px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
.twoColFixRtHdr #footer {
padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
background:#DDDDDD;
.twoColFixRtHdr #footer p {
margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
.fltlft { /* this class can be used to float an element left in your page */
float: left;
margin-right: 8px;
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
-->
</style><!--[if IE 5]>
<style type="text/css">
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixRtHdr #sidebar1 { width: 220px; }
</style>
<![endif]--><!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixRtHdr #sidebar1 { padding-top: 30px; }
.twoColFixRtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]--></head>
<body class="twoColFixRtHdr">
<div id="container">
<div id="header">
<h1>Header</h1>
<!-- end #header --></div>
<div id="sidebar1">
<h3>Sidebar1 Content</h3>
<!-- InstanceBeginEditable name="RightSideBar" -->
<p>Right Side Bar Content - - - </p>
<p>Inserted pic below here</p>
<p><img src="/images/Syntergy5.jpg" width="123" height="105" /></p>
<p>The background color on this div will only show for the length of the content. If you'd like a dividing line instead, place a border on the right side of the #mainContent div if it will always contain more content. </p>
<p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</p>
<!-- InstanceEndEditable -->
<p> </p>
<!-- end #sidebar1 --></div>
<div id="mainContent">
<h1> Main Content </h1>
<!-- InstanceBeginEditable name="MainContent" -->
<p>Main Content - - </p>
<p>inserted pic below here:</p>
<p><img src="/images/Kelly1.jpg" width="285" height="236" /></p>
<p> </p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero. </p>
<!-- InstanceEndEditable -->
<p>
<!-- end #mainContent -->
</p>
</div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<div id="footer">
<p>Footer</p>
<!-- end #footer --></div>
<!-- end #container --></div>
</body>
<!-- InstanceEnd --></html> -
Viewing new template in dreamweaver cs3 reverst to front page ??
When i save a new template in Dreamweaver CS3 and then try to preview in IExploer it asks me "do you wnat to open or save this file? when i select either it reverst to my old MS Front Page editor
From their website:
" Adobe Flash (version 8 or higher) is required to edit the
FLA file.
- Use the source codes at your own risk after downloading and
flashmo.com is
not responsible for any bugs or errors caused by
ActionScripts."
Do you own Flash? Are you familliar with action scripts? If
not, then you
probably want to start with a plain html template and learn
how to code html
and CSS. Flash sites look nice but they are not friendly for
Search Engines
or users who don't have flash player installed on their
system.
Here are some on-line tutorials to help you get started with
html and CSS
code:
www.w3schools.com (free)
www.Lynda.com (pay videos)
Adobe help - "Getting Started"
--Nancy O.
Alt-Web Design & Publishing
www.alt-web.com
"jdbcmcbride" <[email protected]> wrote in
message
news:ftr2vf$i4q$[email protected]..
> I am a first-time user of DreamWeaver and am currently
learning how to
build a
> website with the Adobe HTML article that they have.
However, I found a
flash
> template that I downloaded as it is exactly what I want
to use for my
website.
> My problem is, I don't know how to make it work.
>
> The template is located at
http://www.flashmo.com/home
and it is the one
on
> page 5 called "037 Wooden". If anyone can tell me what
to do to get this
to be
> my website, I would really appreciate it.
> -
Why do my templates break whenever I load a stylesheet?
My page templates break any time I load a stylesheet. If I don't use a template or use one that doesn't have a stylesheet attached to it my products and catalog show up just fine. What's going on?
http://toffee01.businesscatalyst.com/order-test.html This one uses a template that loads a stylesheet and the bc content doesn't render.
http://toffee01.businesscatalyst.com/order2.html This one doesn't use a template and the content renders.Hi Liam,
Thanks for your response. I want to use the built-in e-commerce capabilities of bc. The onepoundbox.html page is simply a placeholder to guide me when I apply styles to the bc layout for products.
When I try to use BC tags for the catalog or product {module_catalog,####} the dynamically-generated content doesn't seem to render if I have any stylesheet applied to the template.
If I remove the template, the content renders.
Here's the code in the editable region of my page:
<h1>Catalog Page</h1>
<p>{module_catalogue,192388}</p>
When I load the page: http://toffee01businesscatalyst.com/catalog.html
http://toffee01.businesscatalyst.com/catalog.html
the catalogue doesn't show up. I don't understand why. -
Template breaks when viewing Blog Post Details Layout
I've made a new ECommerce site with my own template (HTML en CSS). On the Blog Post List is my new template. But when I click on the title or permalink, Then my template breaks and all I see is the text from my template and the blog post detail. What can I do?
Regards,
A.H. BakkerYes, just as I suspected. A lot of your CSS, JS and IMAGE assets are referenced incorrectly in your page template or page.
Right now, in your page template you are referecing IMG elements with a "relative URL":
<img src="images/myimage.jpg"/>
That will work fine on the homepage and first-level pages like "/" and "/blog" because the browser will attempt to load:
http://yoursite.com/images.myimage.jpg
But, if like on your blog detail pages which are located deeper in the websites folder structure "/blog/nog-maar-eentje" since this URL places you on the "nag-maareetje" page inside the "blog" folder, your relative URL will lead the browser to try and load
http://yoursite.com/blog/myimage.jpg
That is not the correct location for our images folder which is directory in the site's root folder. To avoid this issue, you need to update your references to all images that's SRC attribute start with "images/" and change it to a "site relative URL" simply by prepending a "/" at the beginnging of the SRC attribute:
<img src="/images/myimage.jpg"/>
You'lll need to replicate this process for your CSS and Javascript references too. CSS references will look like:
<link href="css/style.css" rel="stylesheet" type="text/css" />
Becomes:
<link href="/css/style.css" rel="stylesheet" type="text/css" />
And javascript:
<script type="text/javascript" src="js/lib.js"></script>
Becomes
<script type="text/javascript" src="/js/lib.js"></script>
Anywhere that a reference to a javascript, stylesheet or image starts without a slash, "/" and just begins with the folder or asset ("images/...", "myimage.jpg") are relative URLs. You'll also see URLs that are absolute and those are URLs in your code that start with "http://yoursite.com" or "http://yoursite.businesscatalyst.com". Those you don't have to worry about since they are absolute and won't get mucked up when you are trying to load those from page within your site.
After you edit your page templates you might need to fix the same problem in your pages that are in a subfolder of your site. -
Hi
I've built a website using DW8 templates--no problem. I
decided to try the 'swapimage' behaviour. I added a dozen images,
sized ready to display in a table (uneditable region) updated all
the pages, uploaded all pages onto server and my website
disappears.
Go into my template code, delete the javascipt, update pages,
reload, website re-appears.
Decided to make the table a (editable region) to host the
swapimage behaviour, repeat the process, upload all web pages onto
server and my website disappears. Its almost like a layer is
covering the entire page, all the pages.
Again I go into the code view, delete the javascript, upload
all onto server and website re-appears. Okay I'll download the
Kaosweaver extension 'Dynamic images' and my problems will be
over--same thing--the javascript is causing havoc with my template.
Any help will be greatly appreciated.\
BobHelp would not be possible without seeing your pages. Can you
post a link
to one that works and one that doesn't, please?
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"auctioneer" <[email protected]> wrote in
message
news:etq0rt$eur$[email protected]..
> Hi
>
> I've built a website using DW8 templates--no problem. I
decided to try the
> 'swapimage' behaviour. I added a dozen images, sized
ready to display in a
> table (uneditable region) updated all the pages,
uploaded all pages onto
> server
> and my website disappears.
>
> Go into my template code, delete the javascipt, update
pages, reload,
> website
> re-appears.
>
> Decided to make the table a (editable region) to host
the swapimage
> behaviour,
> repeat the process, upload all web pages onto server and
my website
> disappears.
> Its almost like a layer is covering the entire page, all
the pages.
>
> Again I go into the code view, delete the javascript,
upload all onto
> server
> and website re-appears. Okay I'll download the
Kaosweaver extension
> 'Dynamic
> images' and my problems will be over--same thing--the
javascript is
> causing
> havoc with my template.
>
> Any help will be greatly appreciated.\
>
> Bob
> -
Hi
I have a problem I need help with. I've attached the code
from my DW8 template. I insert this small 'html' form and it messes
up my template view. The form is for viewers to subscribe to our
newsletter. Please have a look and try and see where I need to make
my corrections.
ps: when I upload the page/website everything is fine, its
just the view in DW design--it's almost like when I put the form in
the table, the entire table collapses.
please be explicit with directions--I'm not a professional
web designer.
HELP!> www.aahalton.org
the nested tables aren't easy to sight read in a few minutes.
What i think is the problem-
One- should have <form> and </form> around the
JumpMenu select list.
Two- the other form, it is across several table cells.
Instead of the opening form tag being in the first TD with a
form field in
it, the form tag should open before the <table> tag
that contains the form
fields, and close after </table>
In short- the tags are nested wrong.
<table>
<tr>
<td>
<form></td>
<td></form></td>
</tr>
</table>
<form><table>
<tr>
<td></td>
<td></td>
</tr>
</table></form>
<table>
Alan
Adobe Community Expert, dreamweaver
http://www.adobe.com/communities/experts/ -
What is it about this markup that breaks DW CS3 Design View Editing?
Folks:
I'm attaching very simple --and apparently completely valid-- markup that generates the text shown between the markers below:
------------start----------------
yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda yadda badda.
------------end----------------
As you can see by examining the file, it contains only an span enclosing text and spaces, and some following breaks. This file passes DW validation: no errors or warnings.
If I open this file in DW CS3 Design View, select and delete the last word, "badda", the entire text --every "yadda"-- is also deleted. All that text is really gone -- if I immediately save the file and re-open it, there is no text content at all, just the span pair, spaces, and the trailing breaks. This is completely repeatable.
When you edit this file, do you get the same result?
The attached file is a cut-down, simplified version of a production file that exhibits this issue. (That file also passes validation.) When I delete single words, entire content paragraphs disappear. So this is not just a point of curiosity. I need to figure out how to fix the production code and avoid this problem in the future.
What is it about the attached markup that causes this issue? I've fooled around with this code quite a bit and the best I can figure out is that DW is confused when both the start- and end- span tags are followed immediately by a line break. Inserting a space in either place makes the issue go away. But the production code doesn't have any occurances of this pattern. And, anyway, line-breaks have no significance to html, just for source-code formatting, right?
Am I missing something incredibly obvious?
TIA
hen3ryNancy O:
Thank you for your response, which gave me valuable clues to understanding the issues. (Specifically, it led me to re-read and understand better the nitty-gritty of the HTML4 specs, section 7, "The global structure of an HTML Document", especially 7.5.1 The BODY element.)
I believe you are saying --in sum-- that to be reliably edited in DW, each source file must comprise a syntactically correct and complete HTML Document.
I am attaching a second file, "badcode2.html", modified substantially as you suggest. It passes the DW validator, the validator.w3.org test, and the www.totalvalidator.com test. No errors or warnings.
I do this: Launch DW, open this file, choose Design View if necessary, select the final word of text, "badda", and activate Edit-->Cut (or Delete). As before, all the other text is deleted as well. This is repeatable.
It seems to me this sample code satisfies your general principle. Could I be misapplying the three validation tests? Or that passing these tests does not assure the document is syntactically correct and complete? Can you recommend other tests?
I'd like to add the following two points as a matter of background and a bit of niggling:
--I'm aware that complete HTML pages must contain <html> , <head>, and <body> tags, although the HTML4 specification seems to say <body> tags are optional. All my production pages, as served, contain these tags. My underlying design is a php template with individual content files incorporated by inclusion. There may be only one set of <html> , <head>, and <body> in a page. The "outer" template code provides these tags, and individual content files cannot contain a nested set -- so they must be "bare" markup. Is DW able to support this design, in which "bare markup" files are seemingly unavoidable? Is there a mechanism analogous to DW Design-Time Style Sheets to provide virtual existence of these tags so "bare markup" files can be successfully edited? I've looked for such a mechanism but not found one. Or some completely different method?
--You specify the inclusion of <p> or <h1> tags within the body. Is there some special significance of <p> or <h1> with respect to stable editing in DW? My reading of the HTML4 spec indicates that a single block element is the minimal requirement for body content. Either of these tags qualify, right? But so does <div>, and that's what I use in my current example. Am I misunderstanding something?
Bottom line, I'm looking for a pragmatic solution for my problem: Once in a while, among hundreds of structurally similar "bare markup" pages I edit in DW without any problem, I lose data. If inserting an additional tag into all my content include files eliminates these occasional problems, I'm willing to do that, as long as: (1) There is an arguable technical basis for the addition, (2) the added tag does not produce anything visible on the served page, and (3) the validators don't flag the extra tag.
Suggestions, please!
Thanks,
hen3ry -
DW 8 Templates in Dreamweaver CS3
Greetings,
I am currently working with a Dreamweaver template (Version
8) and I have recently installed Dreamweaver CS3 to check it out. I
wanted to update several pages with the updated template in CS3,
but when I tried, I got an error related to nested editable
regions. I checked out my code, and cleaned it up (it is strict
xhtml 1.0) and tried again. I didn't get the error, but none of the
pages are updated. Does somebody know why this could happen?If you have made changes to a template page and those changes
are not
propagated to the respective child pages then only one of two
possibilities
exist:
1. Your changes were made to EDITABLE regions in the template
files, or
2. The site cache is corrupted, and can be fixed by using
SITE | Advanced >
Recreate Site Cache
Might one of those be the cause?
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Melissa_Serrano" <[email protected]> wrote
in message
news:f7gk2r$k45$[email protected]..
> Greetings,
>
> I am currently working with a Dreamweaver template
(Version 8) and I have
> recently installed Dreamweaver CS3 to check it out. I
wanted to update
> several
> pages with the updated template in CS3, but when I
tried, I got an error
> related to nested editable regions. I checked out my
code, and cleaned it
> up
> (it is strict xhtml 1.0) and tried again. I didn't get
the error, but none
> of
> the pages are updated. Does somebody know why this could
happen?
> -
Actions and Templates CS2 to CS3
Looking for pointer to a resource that will explain how to migrate important resources from Photoshop CS2 to CS3. Principally interested in actions and metadata templates, but there may be others.
Renee,
Since CS, PS has the ability to easily handle most common PARs, because of its interface with video, where PARs are a big deal. If you're going to Web, or going to print, then square pixels, are what you need, and what PS was originally designed to work with.
Are you opening frame-captures from video? These could be almost any file format, TIFF, TGA, JPG, BMP, PSD, etc. If so, then they may well have a different PAR. Are you adding these TIFFs to a New Image, created with, say, the NTSC 4:3 .9 PAR setting?
If all you do is square pixel work, and all of your Assets are square pixel images, AND PS is still telling you about the PAR, then a pref. is likely messed up for you. Try restting your prefs.
Hunt -
Slicing and optimising a template in PS CS3?
Hello, I am just working on a website design in photoshop but now I would like to slice and optimize the template in imageready but I've just noticed that ImageReady is not available any more? Could someone please suggest how I can slice the design up without using ImageReady? Would I need to use fireworks? Does anybody know where I can read some tutorials?
Thank you, RyanPhotoshop CS3 is capable of slicing. You will find the slice tool in the tool bar.
Silk -
Adding template break box model and font
I have been working on this one for a few hours now and I can't figure it out. I am working with the HTML5 Boilerplate and recreating the home page for our company. When I do not include the template, the file works fine in IE. But the second I apply a template the whole page becomes broken and the IE box model applies and my font sizing gets messed up.
I have included a link to the files on a testing server, if this is not allowed, let me know and I can put up the code.
Excuse the cupcakes from FlexSlider, I have not yet finished that piece.
Working (no template): http://www.qa.mpay.com/index.asp
Not working (template): http://www.qa.mpay.com/copy.asp
Do I just need to rework my entire code so that it is more compliant with the IE Box Model qualifications, ie. div inside of a div with width on one and padding/margin on the other?Alright here's the code for the one that's not working. After posting last night, I realized the links were probably only viewable internally.
UPDATE: Just added <html> after <!doctype html> like I've seen you post about in another forum discussion. That seems to have fixed it. Why is that needed? Isn't it the html tag being opened in the line <html class="no-js" lang="en"> What I mean by this, is why does it work fine in other browsers when that is missing, but it messes up with IE?
P.S. I'm starting to blame H5BP for poor documentation, but I'm learning a lot in the process.
TEMPLATE: (without <html>)
templates>template_page_home_new.dwt
<!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<!-- Use the .htaccess and remove these lines to avoid edge case issues.
More info: h5bp.com/b/378 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- TemplateBeginEditable name="doctitle" -->
<title>MPAY Inc.</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="tags" -->
<meta name='description' content='Payroll Software/Services- Business Process Outsourcing, Reseller and Referral Programs for Payroll Providers, Brokers, CPAs, and more offered by MPAY Inc'/>
<meta name='keywords' content='MPAY, payroll, payentry.com, millennium, millennium payroll, payroll processing, payroll software, online payroll, outsourcing, business process outsourcing, timekeeping, Boston, MA, Charlotte, NC, work comp, workers comp, SecureView, online tax forms'/>
<!-- TemplateEndEditable -->
<!-- Mobile viewport optimized: j.mp/bplateviewport -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons -->
<!-- CSS: implied media=all -->
<!-- CSS concatenated and minified via ant build script-->
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" href="../css/flexslider.css" type="text/css" media="screen" />
<!-- end CSS-->
<!-- FlexSlider pieces -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<!-- All JavaScript at the bottom, except for Modernizr / Respond.
Modernizr enables HTML5 elements & feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries
For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ -->
<script src="../js/libs/modernizr-2.0.6.min.js"></script>
</head>
<body>
<div id="container">
<!-- Header Start -->
<div id="navigation">
<div id="logoregion">
<div id="logo">
<a href="default.asp"><img src="../images/logo.gif" alt="mpay_logo" /></a>
</div>
<div id="headerlink">
<ul>
<li><a href="../client-login.asp"><p class="new">NEW!</p> <img src="../images/blue_bullet_line.gif" alt=""> Client Login </a></li>
<li><a href="contact_us.asp"><img src="../images/blue_bullet_line.gif" alt=""> Contact Us </a></li>
<li><a href="careers.asp"><img src="../images/blue_bullet_line.gif" alt=""> Careers </a></li>
<li><a href="about_us.asp"><img src="../images/blue_bullet_line.gif" alt=""> About Us</a></li></ul>
</div>
<div id="contact">
(781) 810-9000<br />
<a href="mailto:[email protected]">[email protected]</a>
</div>
</div>
<div id="mainnav">
<ul class="navigation-controls">
<li><a href="../index.html"><p class="navigation-text">Home</p></a></li>
<li><a href="../services.html"><p class="navigation-text">Services</p></a></li>
<li><a href="../products.html"><p class="navigation-text">Products</p></a></li>
<li><a href="../solutions.html"><p class="navigation-text">Solutions</p></a></li>
<li><a href="../support.html"><p class="navigation-text">Client Support</p></a></li>
<li class="nav-border-right"><a href="../resources.html"><p class="navigation-text">Resources</p></a></li>
</ul>
</div>
</div>
<!-- Header End -->
<!-- TemplateBeginEditable name="EditRegionContent" --><!-- TemplateEndEditable -->
<!-- Footer Start -->
<div id="footer">
<div id="footercontent">
<div id="legal">
<a href="../index.html">MPAY Inc.</a> |
<a href="../legal.html">Legal Notices</a> |
<a href="../privacy.html">Your Privacy</a>
</div>
<div id="copyright">
<script type="text/javascript">
now=new Date();
year=now.getFullYear();
</script>
© Copyright
<script type="text/javascript">
document.write (year);
</script>
MPAY, Inc. All Rights Reserved.</div>
</div>
</div>
<!-- Footer End -->
</div>
<!-- JavaScript at the bottom for fast page loading -->
<!-- TemplateBeginEditable name="JavaCode" --><!-- TemplateEndEditable -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../js/libs/jquery-1.6.2.min.js"><\/script>')</script>
<!-- scripts concatenated and minified via ant build script-->
<script defer src="../js/plugins.js"></script>
<script defer src="../js/script.js"></script>
<!-- end scripts-->
<!-- Act-On Analytics Code -->
<script type="text/javascript">
/* <![CDATA[ */
document.write (
'<img src="http://marketing.mpay.com/acton/bn/1170/visitor.gif?ts='+
new Date().getTime()+
'&ref='+escape(document.referrer) + '">'
/* ]]> */
</script>
<!-- Google Analytics Code -->
<script>
window._gaq = [['_setAccount','UA-12607129-1'],['_trackPageview'],['_trackPageLoadTime']];
Modernizr.load({
load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
</script>
</body>
</html>
File it's being applied to:
copy.asp
<!-- InstanceBegin template="/Templates/template_page_home_new.dwt" codeOutsideHTMLIsLocked="false" --><!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<!-- Use the .htaccess and remove these lines to avoid edge case issues.
More info: h5bp.com/b/378 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- InstanceBeginEditable name="doctitle" -->
<title>MPAY Inc.</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="tags" -->
<meta name='description' content='Payroll Software/Services- Business Process Outsourcing, Reseller and Referral Programs for Payroll Providers, Brokers, CPAs, and more offered by MPAY Inc'/>
<meta name='keywords' content='MPAY, payroll, payentry.com, millennium, millennium payroll, payroll processing, payroll software, online payroll, outsourcing, business process outsourcing, timekeeping, Boston, MA, Charlotte, NC, work comp, workers comp, SecureView, online tax forms'/>
<style type="text/css">
<!--
.style1 {color: #00274c}
-->
</style>
<!-- InstanceEndEditable -->
<!-- Mobile viewport optimized: j.mp/bplateviewport -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons -->
<!-- CSS: implied media=all -->
<!-- CSS concatenated and minified via ant build script-->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/flexslider.css" type="text/css" media="screen" />
<!-- end CSS-->
<!-- FlexSlider pieces -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<!-- All JavaScript at the bottom, except for Modernizr / Respond.
Modernizr enables HTML5 elements & feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries
For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ -->
<script src="js/libs/modernizr-2.0.6.min.js"></script>
</head>
<body>
<div id="container">
<!-- Header Start -->
<div id="navigation">
<div id="logoregion">
<div id="logo">
<a href="default.asp"><img src="images/logo.gif" alt="mpay_logo" /></a>
</div>
<div id="headerlink">
<ul>
<li><a href="client-login.asp"><p class="new">NEW!</p> <img src="images/blue_bullet_line.gif" alt=""> Client Login </a></li>
<li><a href="contact_us.asp"><img src="images/blue_bullet_line.gif" alt=""> Contact Us </a></li>
<li><a href="careers.asp"><img src="images/blue_bullet_line.gif" alt=""> Careers </a></li>
<li><a href="about_us.asp"><img src="images/blue_bullet_line.gif" alt=""> About Us</a></li></ul>
</div>
<div id="contact">
(781) 810-9000<br />
<a href="mailto:[email protected]">[email protected]</a>
</div>
</div>
<div id="mainnav">
<ul class="navigation-controls">
<li><a href="index.html"><p class="navigation-text">Home</p></a></li>
<li><a href="services.html"><p class="navigation-text">Services</p></a></li>
<li><a href="products.html"><p class="navigation-text">Products</p></a></li>
<li><a href="solutions.html"><p class="navigation-text">Solutions</p></a></li>
<li><a href="support.html"><p class="navigation-text">Client Support</p></a></li>
<li class="nav-border-right"><a href="resources.html"><p class="navigation-text">Resources</p></a></li>
</ul>
</div>
</div>
<!-- Header End -->
<!-- InstanceBeginEditable name="EditRegionContent" --><!--! start of #container -->
<div id="slideshow">
<!--=============================
Markup for FADE animation
=================================-->
<div class="flexslider">
<ul class="slides">
<li>
<a href="#"><img src="img/planet_hollywood.jpg" />
<div class="flex-caption">
<div id="slideone">
<h2 class="gold" >MPAY Sales & Product <br />Roadmap Workshop</h2><br />
<h3 class="white">
March 2, 2012 / Las Vegas
<br />
</h3>
<br /> <br /> <br />
<p class="gold underline">
Learn more about IPPA Event
</p>
</div>
</div></a>
</li>
<li>
<a href="#"><img src="img/inacup_samoa.jpg" />
<div class="flex-caption">
<h2 >Our Products</h2><br />
<h3 >Payentry.com
<br />Secure and reliable online solution for payroll and human resource management
Millennium
<br />User-friendly PC solution provides a flexible system with robust functionality
</h3>
</div></a>
</li>
<li>
<a href="#"><img src="img/inacup_donut.jpg" />
<div class="flex-caption">
<h2 >Our Solutions</h2><br />
<h3 >Business Process Outsourcing<br />
Reseller Program<br />
Referral Program<br />
Direct Services
</h3>
</div></a>
</li>
<li>
<a href="#"><img src="img/inacup_pumpkin.jpg" />
<div class="flex-caption">
<h2 >Compliance & Security</h2><br />
<h3 >Payroll Processing and Tax Management<br />
Employee Management<br />
New Hire Reporting<br />
Workers’ Compensation<br />
Wage Garnishment<br />
COBRA Administration
</h3>
</div></a>
</li>
<li>
<a href="#"><img src="img/inacup_donut.jpg" />
<div class="flex-caption">
<h2 >Paperless Solutions</h2><br />
<h3 >Secure Document Delivery via SecureView<br />
Employee Self Service with Online Tax Forms<br />
Money Network Payroll Distribution Service
</h3>
</div></a>
</li>
</ul>
<div >
<ul class="custom-controls">
<li><a href="#">Upcoming Events</a></li>
<li><a href="#">Our Products</a></li>
<li><a href="#">Our Solutions</a></li>
<li><a href="#">Compliance & Security</a></li>
<li><a href="#">Paperless Solutions</a></li>
</ul>
</div>
</div>
</div>
<div id="main" role="main">
<div id="banner">
<div id="leftbanner" class="bluedropshadow">Learn how MPAY can find a <br />solution that’s right for you.</div>
<div id="bannerdivision">
<img src="img/banner_division.png" alt="" />
</div>
<div id="rightbanner">
<div id="emailbutton">
<a href="#"><img src="img/email_us_button.png" alt="Email Us!" /></a></div>
<div id="or" class="bluedropshadow">or</div>
<div id="callus">
Call us today at<br />
781-810-9000</div>
</div>
</div>
<div id="bannerbottom">
</div>
<div id="leftcol">
<div id="introduction">
<p>MPAY Inc. is a <a href="#">payroll software</a> and <a href="#">services</a> company providing strategic <a href="#">business solutions</a> to employers and business partners nationwide. MPAY presents a variety of programs, including <a href="#">business process outsourcing</a>, to a wide range of <a href="#">industries</a>. MPAY’s offerings streamline processes, improve productivity, and simplify administration, allowing clients to get the most out of their workday.</p>
</div>
<div id="twitterfeed">
<div id="twitterlogo">
<h4>Twitter<br />Feed</h4>
</div>
<div id="twitter">
</div>
<p class="viewall"><a href="#">View All</a></p>
</div>
</div>
<div id="rightcol">
<div id="mediacenter">
<div>
<h4>Media Center</h4>
</div>
<div id="medialinks">
<p class="medialinks"><a href="#"><img class="mediaicons" src="img/news_icon.png" alt="News Icon" />News</a></p>
<p class="medialinks"><a href="#"><img class="mediaicons" src="img/press_icon.png" alt="Press Release Icon" />Press Releases</a></p>
<p class="medialinks"><a href="#"><img class="mediaicons" src="img/calendar_icon.png" alt="Calendar Icon" />Calendar</a></p>
<p class="medialinks"><a href="#"><img class="mediaicons" src="img/client_icon.png" alt="Client Testimonials Icon" />Client Testimonials</a></p>
</div>
</div>
<div id="affandawards">
<div id="affandawardstitle">
<h4>Affiliates & Awards</h4>
</div>
<div id="affandawardsframe">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="200" height="150" title="sponsors_small">
<param name="movie" value="sponsors_small.swf">
<param name="quality" value="high">
<embed src="sponsors_small.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="200" height="150"></embed>
</object>
</div>
</div>
<div id="socialmedia">
<div id="reachout">
Reach <br />Out To Us!
</div>
<div id="socialarrow">
<img src="img/social_arrow.gif">
</div>
<div id="socialicons">
<a href="#"><img class="socialmediaicons" src="img/facebook_30px.gif" alt="Facebook Icon" /></a>
<a href="#"><img class="socialmediaicons" src="img/twitter_30px.gif" alt="Twitter Icon" /></a>
<a href="#"><img class="socialmediaicons" src="img/linkedin_30px.gif" alt="LinkedIn Icon" /></a>
</div>
</div>
</div>
</div>
<!--! end of #container -->
<!-- InstanceEndEditable -->
<!-- Footer Start -->
<div id="footer">
<div id="footercontent">
<div id="legal">
<a href="index.html">MPAY Inc.</a> |
<a href="legal.html">Legal Notices</a> |
<a href="privacy.html">Your Privacy</a>
</div>
<div id="copyright">
<script type="text/javascript">
now=new Date();
year=now.getFullYear();
</script>
© Copyright
<script type="text/javascript">
document.write (year);
</script>
MPAY, Inc. All Rights Reserved.</div>
</div>
</div>
<!-- Footer End -->
</div>
<!-- JavaScript at the bottom for fast page loading -->
<!-- InstanceBeginEditable name="JavaCode" -->
<!-- Hook up the FlexSlider -->
<script type="text/javascript">
$(window).load(function() {
$('.flexslider').flexslider({
manualControls: '.custom-controls li a'
</script>
<!-- Twitter Feed -->
<script type="text/javascript">
$(document).ready(function(){
$.getJSON('http://twitter.com/status/user_timeline/MPAYInc.json?count=3&callback=?', function(data){
$.each(data, function(index, item){
$('#twitter').append('<div class="tweet"><p>' + item.text.linkify() + '</p><p class="timestamp">' + relative_time(item.created_at) + '</p></div>');
function relative_time(time_value) {
var values = time_value.split(" ");
time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
var parsed_date = Date.parse(time_value);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
delta = delta + (relative_to.getTimezoneOffset() * 60);
var r = '';
if (delta < 60) {
r = 'a minute ago';
} else if(delta < 120) {
r = 'couple of minutes ago';
} else if(delta < (45*60)) {
r = (parseInt(delta / 60)).toString() + ' minutes ago';
} else if(delta < (90*60)) {
r = 'an hour ago';
} else if(delta < (24*60*60)) {
r = '' + (parseInt(delta / 3600)).toString() + ' hours ago';
} else if(delta < (48*60*60)) {
r = '1 day ago';
} else {
r = (parseInt(delta / 86400)).toString() + ' days ago';
return r;
String.prototype.linkify = function() {
return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(m) {
return m.link(m);
</script><!-- InstanceEndEditable -->
<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../js/libs/jquery-1.6.2.min.js"><\/script>')</script>
<!-- scripts concatenated and minified via ant build script-->
<script defer src="js/plugins.js"></script>
<script defer src="js/script.js"></script>
<!-- end scripts-->
<!-- Act-On Analytics Code -->
<script type="text/javascript">
/* <![CDATA[ */
document.write (
'<img src="http://marketing.mpay.com/acton/bn/1170/visitor.gif?ts='+
new Date().getTime()+
'&ref='+escape(document.referrer) + '">'
/* ]]> */
</script>
<!-- Google Analytics Code -->
<script>
window._gaq = [['_setAccount','UA-12607129-1'],['_trackPageview'],['_trackPageLoadTime']];
Modernizr.load({
load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
</script>
</body>
<!-- InstanceEnd --></html>
CSS
css>style.css
* HTML5 ✰ Boilerplate
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
* Detailed information about this CSS: h5bp.com/css
* ==|== normalize ==========================================================
/* =============================================================================
HTML5 display definitions
========================================================================== */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
/* =============================================================================
Base
========================================================================== */
* 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
* 2. Force vertical scrollbar in non-IE
* 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 100%; line-height: 150%; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate
* Also: hot pink! (or customize the background color to match your design)
::-moz-selection { background: #496793; color: #fff; text-shadow: none; }
::selection { background: #496793; color: #fff; text-shadow: none; }
/* =============================================================================
Links
========================================================================== */
a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }
/* =============================================================================
Typography
========================================================================== */
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
/* =============================================================================
Lists
========================================================================== */
ul, ol { margin: 0em 0; padding: 0 0 0 0px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
/* =============================================================================
Embedded content
========================================================================== */
* 1. Improve image quality when scaled in IE7: h5bp.com/d
* 2. Remove the gap between images and borders on image containers: h5bp.com/e
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
* Correct overflow not hidden in IE9
svg:not(:root) { overflow: hidden; }
/* =============================================================================
Figures
========================================================================== */
figure { margin: 0; }
/* =============================================================================
Forms
========================================================================== */
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }
* 1. Correct color not inheriting in IE6/7/8/9
* 2. Correct alignment displayed oddly in IE6/7
legend { border: 0; *margin-left: -7px; padding: 0; }
* 1. Correct font-size not inheriting in all browsers
* 2. Remove margins in FF3/4 S5 Chrome
* 3. Define consistent vertical alignment display in all browsers
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
* 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
* 2. Correct inner spacing displayed oddly in IE6/7
button, input { line-height: normal; *overflow: visible; }
* Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
table button, table input { *overflow: auto; }
* 1. Display hand cursor for clickable form elements
* 2. Allow styling of clickable form elements in iOS
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
* Consistent box sizing and appearance
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
* Remove inner padding and border in FF3/4: h5bp.com/l
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
* 1. Remove default vertical scrollbar in IE6/7/8/9
* 2. Allow only vertical resizing
textarea { overflow: auto; vertical-align: top; resize: vertical; }
/* Colors for form validity */
input:valid, textarea:valid { }
input:invalid, textarea:invalid { background-color: #f0dddd; }
/* =============================================================================
Tables
========================================================================== */
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
/* =============================================================================
Eric Meyer Reset Snippet
========================================================================== */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
/* ==|== primary styles =====================================================
Author:
========================================================================== */
body {
max-width: 49.6875em;
text-align: center;
margin: auto;
#container{
text-align: left;
margin: auto;
a {
color: #6699CC;
text-align:left;
text-decoration:underline;
border: none;
a:link { color: #6699CC;}
a:visited { color: #6699CC;}
a:hover { color: #496793;}
a:active { color: #496793;}
/* ==|== text styles ====================================================== */
p{
color:#444444;
font-family:Verdana, sans-serif;
h2{
font-size:2.5em;
line-height:1.25em;
letter-spacing:.02em;
color:#00274c;
font-weight:bold;
font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;
h3{
font-size:1.5em;
line-height:1.25em;
letter-spacing:.02em;
color:#00274c;
font-weight:bold;
font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;
h4{
font-size:1.3125em;
line-height:1.25em;
letter-spacing:.02em;
color:#00274c;
font-weight:normal;
font-family:Verdana, sans-serif;
h5{
font-size:1.3125em;
line-height:1.25em;
letter-spacing:.02em;
color:#00274c;
font-weight: bold;
font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;
/* ==|== navigation styles ====================================================== */
/* Custom Nav */
#navigation{
margin:10px 20px 5px 20px;
width:775px;
#headerlink a:link { color: #666;}
#headerlink a:visited { color: #666;}
#headerlink a:hover { color: #00274C;}
#headerlink a:active { color: #00274C;}
#headerlink li{
font: .625em "Arial Narrow", sans-serif;
display: inline;
text-decoration: none;
list-style-image:url(../images/blue_bullet.gif);
letter-spacing:.08em;
#headerlink a{
text-decoration: none;
#headerlink {
padding: 2px 135px 0px 0px;
float: right;
.new {
text-align:right;
font: bold 1.175em "Arial Narrow", sans-serif;
color:#8f9d4e;
display:inline;
#header {
margin: 15px auto 0 auto;
width:775px;
#logoregion {
width:775px;
height: 91px;
background:url(../images/header_small.gif) no-repeat 0 0;
#contact{
font: bold .75em/1.35em sans-serif;
color: #919194;
padding: 10px 135px 0 0px;
float: right;
text-align:right;
.nav-border-right{
border-right: 1px solid #6699cc;
#logo {
padding: 32px 0 0px 8px;
float: left;
#mainnav {
width: 100%; width: 775px;
height: 28px;
.navigation-text{
text-align: center;
font-weight:bold;
font-size:.75em;
font-family: sans-serif;
letter-spacing:.01em;
padding-top:2px;}
.navigation-controls {width: 100%;}
.navigation-controls li {margin: 0 0 0 0px; float:left; display: inline-block; zoom: 1; *display: inline; list-style:none;}
.navigation-controls li:first-child {margin: 0;}
.navigation-controls li a {color: #00274c; text-align:center; width: 129px; height: 28px; display: block; background: url(../img/main_navigation_tab.gif) no-repeat 0 0; cursor: pointer; text-decoration:none;}
.navigation-controls li a:hover {background-position: 0 -28px; color: #00274c; }
.navigation-controls li a.active {background-position: 0 -28px; color: #00274c; cursor: default; }
#nav a:link { color: #000000;}
#nav a:visited { color: #00274C;}
#nav a:hover { color: #919194;}
#nav a:active { color: #919194;}
#nav li{
list-style-type: none;
display: inline;
div#nav a{
float: left;
text-decoration:none;
padding-top: 2px;
padding-right: 15px;
/* ==|== slideshow styles ====================================================== */
#slideshow {width: 100%; width: 775px; margin: 0 16px; }
#slideone{
width:60%;}
.gold{
color:#d79b00;}
.white{
color:#fff;}
.underline{
text-decoration:underline;}
/* ==|== main styles =========================================================== */
/* ==|== main content column styles ======================================================= */
#main{
background:url(../img/body_bg.jpg) no-repeat 0 0;
width: 775px;
height: 885px;
display:inline-block;
margin-top: 90px;
padding: 30px 20px 0px 20px;
background:url(../img/body_bg.jpg) no-repeat 0 0;
width: 795px;
display:inline-block;
margin-top: 90px;
padding: 30px 0px 0px 0px;
#maincontent{
height: 885px;
padding: 0px 20px;
/* ==|== banner styles ====================================================== */
#banner{
font-size:1.3125em;
line-height:1.25em;
letter-spacing:.02em;
font-weight: bold;
font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;
height: 70px;
width: 755px;
margin: 0px 0px 0px -10px;
padding: 0px 20px 20px 20px;
-moz-border-radius-topleft: 2px;
-moz-border-radius-topright: 2px;
-webkit-border-top-left-radius: 2px;
-webkit-border-top-right-radius: 2px;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
-khtml-border-top-left-radius: 2px;
-khtml-border-top-right-radius: 2px;
background-color: #496793;
background-image: url(../img/banner_bg.gif);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#496793), to(#2c5079));
background-image: -webkit-linear-gradient(top, #496793, #2c5079);
background-image: -moz-linear-gradient(top, #496793, #2c5079);
background-image: -ms-linear-gradient(top, #496793, #2c5079);
background-image: -o-linear-gradient(top, #496793, #2c5079);
#leftbanner{
float: left;
padding-top:20px;}
.bluedropshadow {
color:#00274c;
text-align:left;
text-shadow: 1px 1px 1px #6882a4;}
#bannerdivision{
float: left;
padding: 16px 20px 0 30px;}
#rightbanner{
float: right;
padding-top:20px;
#emailbutton{
float: left;
padding: 5px 0px 0px 0px;
#or{
float: left;
padding: 13px 25px 10px 20px;}
#callus{
color:#ffffff;
width: 180px;
text-align:right;
text-shadow: 1px 1px 1px #00274c;
float: right;}
#bannerbottom{
height: 20px;
background:url(../img/banner_bottom.jpg) no-repeat 0 0;
width: 795px;
margin: 0px 0px 0px -10px;
/* ==|== left column styles ======================================================= */
#leftcol{
float: left;
width: 485px;
#introduction{
padding: 15px;
margin: 10px 30px 30px 30px;
width: 390px;
background-color:#FFFFFF;
border: 1px solid #ededed;}
#twitterfeed{
text-align:right;
margin: 30px;
width: 415px;
#twitterlogo{
text-align:left;
padding:37px 0 0 160px;
height: 78px;
background:url(../img/mpay_twitter_bird.png) no-repeat 0 0;
.tweet {
padding: 1px 0px 1px 0px;
margin: 7px 0;
text-align:left;
font-family: Verdana, sans-serif;
font-size:.75em;
line-height:1.75em;
.timestamp {
text-align:right;
font-weight: normal;
color:#8f9d4e;
.viewall {
padding: 12px 0 0 0;
/* ==|== right column styles ====================================================== */
#rightcol{
float: right;
width: 290px;
#mediacenter{
margin: 10px 30px 50px 30px;
#medialinks{
padding: 10px 0 0 0;
.mediaicons{
vertical-align:middle;
padding: 0px 10px 0 0;
.medialinks{
vertical-align:middle;
padding: 10px 0 0 0;
#viewall {
padding: 12px 0 0 0;
#affandawards{
margin: 50px 5px 23px 14px;
#affandawardstitle{
margin: 0px 25px 0px 16px;
#affandawardsframe{
margin: 20px 0 0 0;
padding: 27px 40px 50px 29px;
background:url(../img/flash_bg.png) no-repeat 0 0;
#socialmedia{
margin: 23px 30px 30px 30px;
#reachout{
float:left;
font-size:1.875em;
line-height:1.25em;
color:#8f9d4e;
font-weight:bold;
font-family:Avant Garde Gothic, ITC Avant Garde Gothic, AvantGarde Md BT, AvantGarde Bk BT, Avant Garde, Century Gothic, Arial, sans-serif;
#socialarrow{
float: right;
padding: 20px 0 0 0;
#socialicons{
float: left;
padding: 15px 0 0 0;
.socialmediaicons{
padding: 0 5px 0 0;
/* ==|== footer styles = -
SWF's in DW8 templates for IE7
I remember finding the answer to this problem ages ago, but I
can't remember what it was and I desperately need to know.
I am trying to use a flash movie in a template in DW8, but
when the template is applied to the page and previewed in IE7 the
flash movie appears as a white box. If memory serves me right this
problem reared it's ugly head at the same time as the boxes
appeared around flash files and flash buttons had to be clicked
twice to make 'em work. I think Adobe/macromedia did something in
the fix which cured that problem but buggered the flash from
working in the templates. I could be wrong but I vaguely remember
having to turn off one of the new workarounds.
Any help would much appreciated.
Ralph Ferrand
Vision Design
www.vduk.co.ukMake your link to the Flash file a root relative one.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Cevema" <[email protected]> wrote in
message
news:en8mu5$ld5$[email protected]..
>I remember finding the answer to this problem ages ago,
but I can't
>remember
> what it was and I desperately need to know.
>
> I am trying to use a flash movie in a template in DW8,
but when the
> template
> is applied to the page and previewed in IE7 the flash
movie appears as a
> white
> box. If memory serves me right this problem reared it's
ugly head at the
> same
> time as the boxes appeared around flash files and flash
buttons had to be
> clicked twice to make 'em work. I think Adobe/macromedia
did something in
> the
> fix which cured that problem but buggered the flash from
working in the
> templates. I could be wrong but I vaguely remember
having to turn off one
> of
> the new workarounds.
>
> Any help would much appreciated.
>
> Ralph Ferrand
> Vision Design
> www.vduk.co.uk
> -
I have a few pages on my site that will only work in IE if I
detach them from the template.
For example:
http://www.couponsavings.com.au/login.php
works OK in Firefox but not in IE, the footer isn't clearing the ad
column.
I have pulled the css apart to find out why with no luck.
Then I tried detaching it from the template:
http://www.couponsavings.com.au/loginNoTemplate.php
This works perfectly in both Firefox and IE.
I did a save source of both in IE for comparison and they are
identical except for the template markup.
Any help or suggestions appreciated
Thanks
Simon RadfordNot that it causes any problem, but why is "syntax" in
quotes?
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"BeausMom" <[email protected]> wrote in
message
news:ff2j1o$c28$[email protected]..
> Our favorite whipping boy browser, Internet Explorer is
breaking my page
> layout.
>
http://scottsdaleartauction.com
>
> Is there something I can program into my stylesheet(s)
to alleviate the
> problem?
>
>
> .syntax {
> font-family: "syntax", Arial, Helvetica, sans-serif;
> font-size: .8em;
> color: #000000;
> }
> .syntax2 {
> font-family: "syntax", Arial, Helvetica, sans-serif;
> font-size: 0.9em;
> color: #000000;
> line-height: 1em;
> } -
I am a neophyte, self taught DW8 user. Have template for the
87 pages in my site. When I edit template and update my pages, all
of the pages lose their titles.
Thanks!
jeepartsrusThis is the symptom of an improperly made template.
Try this -
1. Create a new page, and use FILE | Save As... > make the
name *.dwt and
save it in the Templates folder.
2. Create a new page, and use FILE | Save As Template... and
let DW decide
where to save it.
Look at the code on the two pages. Can you see the
difference? Always use
the latter method to create your template files. That's how
all well-formed
templates should look.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"baldbobby" <[email protected]> wrote in
message
news:ed16oh$4ql$[email protected]..
>
> I am a neophyte, self taught DW8 user. Have template for
the 87 pages in
> my site. When I edit template and update my pages, all
of the pages lose
> their titles.
> Thanks!
> jeepartsrus
Maybe you are looking for
-
Ipod not recognised by Windows, USB device not recognised
Hi hope someone can help I have recently received my ipod back from Applecare who have sent the ipod back in ' working order ' but it will no longer be recognised by my windows. It says USB device not recognised and i cant find, nor will it install d
-
What is the best backup drive to use to backup my windows xp pc and to transfer these files to my iMac i5 new in May 2011 and then to backup my i5 iMac?
-
It will not run on Mac OSX 10.5.8, on a G% dual 2.0ghz, now my older version of Firefox is gone...
I downloaded Firefox 4.0 and It will not run on Mac OSX 10.5.8, on a Mac G5 dual 2.0ghz. Now my older version of Firefox is gone...Why won't it work, the download page says it is for OSX and does not say it will not work on any particular OSX. Can yo
-
Fetching the sales order data using both system status and user status
Hi, Could any one tell me how to fetch sales orders using both system status and user status. My requirement is to fetch sales order data in a report where the user enters the system status and user status in the selection screen fields. For example
-
DVD-R vs DVD+R/ Whats the Difference & What should i use w Macbook
i have the latest macbook. been using dvd-r and was always curious. can i use DVD+ ? whats the difference? thanks