Div layout design

My first website and using CSS.
www.smilesofmichigan.com
I would like the text on the left to always use the same space as the text on on the right.
I was struggling with the format layout for the text on the right (office hours). I started with two simple columns but changed the text on the right to 3 different divs. This is the general layout I would like except I would like the days of the week to be all line up the same. Would you please help me better code this?
My next step will be making a contact page. I believe a form is the best method to use. Any other comments about the site would be appreciated.
Carlos

carloscast1 wrote:
My first website and using CSS.
www.smilesofmichigan.com
I would like the text on the left to always use the same space as the text on on the right.
I was struggling with the format layout for the text on the right (office hours). I started with two simple columns but changed the text on the right to 3 different divs. This is the general layout I would like except I would like the days of the week to be all line up the same. Would you please help me better code this?
My next step will be making a contact page. I believe a form is the best method to use. Any other comments about the site would be appreciated.
Carlos
The text on the left and the text on the right will always be of different lengths, no matter how much you try to find a solution.
You should not try and restrict the length of text to any particular area, just let it consume how much space it requires. Designing for the web is different from desk top publishing. The web is fluid and so should your design be.
Some people use a scrolling area to restrict the text to a specific height but this is an ugly solution as it creates unsightly scrollbars. Really it's better practice to build in flexibility to the design and plan for variations in column height.
What you should do is wrap your 'welcome' <div> and the 3 <divs> on the right in another <div>. Attach a repeating background image (half white on the left and half green on the right) to the 'wrapper' <div>. This will at least visually make both left and right sections look equal in depth when one side or the other contains more text. Key is to add 'overflow: hidden;' to the css of the 'wrapper' <div> this ensures that it enclosed around the other <divs> inside it.
Days of the week look fine to me on Firefox. I'd say that information is 'tabular data' so use a table if it means the info lines up better. There are more complex css methods but its not worth the effort.

Similar Messages

When moving Div in design view : Top & Left as Percentage?

Hello All,
Whenever I move a div in design view, the left and top values are changed to pixels - I would like these to be given as percentages (using the viewport dimensions I have currently selected).
Is this possible? If so can anyone tell me how to configure this please?
If not, would it be possible for me to create an extension for this? Does the extension API provide that kind of ability?
Thanks in advance,
Peter

#1 DW is not a click & drag application like Photoshop or Illustrator.
#2 Switch to Code View and apply the top: and left: values manually.
CSS:
#DivName {
     position:absolute;
     top:xx%;
     left:xx%;
That said, APDivs seldom work well for primary layouts. Here's why:
http://apptools.com/examples/pagelayout101.php
You would do well to spend some time learning code basics before you start using DW.
HTML & CSS Tutorials - http://w3schools.com/
How to Develop with CSS?
http://phrogz.net/css/HowToDevelopWithCSS.html
Learn CSS positioning in 10 Steps
http://www.barelyfitz.com/screencast/html-training/css/positioning/
Beginner CSS Templates -
For commercial CSS Templates that are rock solid and perform well in all browsers, visit Project Seven:
http://www.projectseven.com/products/index.htm
Not Just a Grid CSS Framework
http://www.notjustagrid.com/demo.asp
EZ-CSS Templates (watch the screencast to see how it works)
http://www.ez-css.org/css_templates
Dreamweaver CSS Templates for beginners (free)
http://www.adobe.com/devnet/dreamweaver/articles/dreamweaver_custom_templates.html
New DW Starter Pages (free)
http://www.adobe.com/devnet/dreamweaver/articles/introducing_new_css_layouts.html
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

AP divs in design of web page

I've been studying some tutorials on designing with CSS -- I'm a newbie, using CS3. I had gotten into the habit of using AP divs to design my web page. I was warned last week that these can cause problems, especially when using features such as the Lightbox extension, so am trying to learn not to use those as much. The problem is, I've found the other methods of web-page layout don't offer the flexibilty of the AP Divs. I use many images, since I'm an artist, and more often than not I run into problems inserting images using the handy ready-made CSS layouts available and used in the tutorials. It's so easy just to draw divs here, draw divs there. Is there a tutorial or other informational guide to help with web page design where many images are used?

In simple terms, I think you're trying to reconcile desktop publishing (traditional page layout) with web design.
They're such completely different media that you'll continue to have trouble bridging the two until you understand more of how web pages work, especially learning HTML and CSS.
APDivs would be great for layout if everyone had the same screen size, resolution and browser viewport size.
Since you cannot predict any of the above, there's 95% chance that your APDivs will seem to be in the wrong place on the page (compared to your intended design) when your visitors view it - even though the APDivs are technically in exactly the correct spot according to the code on every screen.
What to do?
There's no substitute for learning HTML and CSS.
http://www.w3schools.com/html/default.asp
http://www.w3schools.com/css/default.asp
Become familiar with CSS positioning and how it works.
e.g. http://www.barelyfitz.com/screencast/html-training/css/positioning/
Absolute positioning is just one member of a family of positioning methods in CSS.
Unfortunately, as a tool, its resemblance to traditional page layout - which so many people can relate to - means it gets much misunderstood and maligned when, if used correctly, it can be useful - but not for page layout.
Use what you learn to design pages which will work on any device and browser.

Print Layout Designer or Crystal.....! What to do?

Dear All,
We need to link our User forms to Print layouts in order to make our reports work exactly the way SAP reports work. Is there a way to enable the print and print preview toolbar buttons and make them show our Report Layout? So far the response from SDK Forum is not encouraging and many questions regarding the same issue remain unanswered there.
After looking for the solution in the SDK Forums we came across these two replies from Mr. Nick He and Mr.Frank Moebius. Both are of the opinion that currently SAP does not offer a support for this feature and better use a third party tool. We are not in a position right now to opt for any third party tool but if we get a clear response from your side regarding this matter, we can go for it. Kindly have a look at the following links:
Re: Print Layout Design for user form in SapBusinessOne2005A(6.80.317) sp:01.?
Re: Add PLD Layouts in 2005 through sdk
The recommended solution within SAP B1 to develop Add-on reports is through User Queries and creating a Print Layout and run them via Query Manager Window. This approach in our view has the following drawbacks that make it less friendly with the end user:
1. Add-on forms appear in the left pane/menu, whereas reports would have to run through Query Manager only, which is in fact a small toolbar button on the top right side. We can add the Query Manager link to user menu but it doesnt solve the problem.
2. A user with full authorization over the Print Layout can accidentally overwrite it by clicking the Create Report Button, whereas in case of SAP Reports the Layouts remain unchanged and only saved as a new Layout and set as Default Layout for a report. Add-on Reports cannot do this.
3. Different behavior of Layouts in Query Manager on Single Click and Double Click. In the Query Manager, if a user just selects a query by a Single Click and views a Print Preview (Layout) then the custom user Layout appears. But if a user Double clicks a query then the Query Window appears, exposing the query and making it editable. Also the Preview(Layout) is different in this case. The user can either view the Window or Table Layout in this case. Hence this exercise would make the user confused and prone to errors.
4. The Parameter/Criteria window that is SAP generated is not enough to fulfill user friendly interface requirements. Is there a way to add List boxes or Combos to that form. The parameter selection Checkboxes also behave in a strange way that even the experts find difficult to manipulate. If they are of no use, whats the point in having them on the form in the first place.
All these points are leading us to confusion over the decision as to whether go for Query Based Reports or use Third Party tools. Kindly help us out in this regard. Your response would help us save some valuable time for our Add-on Development.

<<< If there is a solution then it has to be from SDK. We can only opt for third party components and frameworks only if any of the SAP representatives ensure us that the current version of SDK does not offer such support.>>>
The answer to that is to lodge your query as an Issue to SAP directly as a support question or go through your local SAP representative. If the functionality is not offered by SAP you can do a Development Request ( DRQ) and SAP will develop it if they think it will become userful.
<<<If this Forum is not meant to be answered by SAP representatives then kindly tell me any other Technical Support Portal from where i can get the answer directly. >>>
This forum is accessed mostly by SAP Business One Developers on SDK. However we are fortunate that some SAP employees who are very knowledgeble take some time off to answer queries.
Since it is a Forum, no one is obliged to answer. As indicated above , Try SAP directly if you need a definite answer.
<<<>>>
Since you mentioned Crystal: We as SAP Business One SDK developers, have come across similar issues and opted for a Inhouse developed Crystal Solution. It has been so popular we are selling it as a Generic add-on to B1.
Regards,
Indika.

Print layout designer for develop report based on query

Dear Experts/Gurus,
I am amazing about the manage previous reconciliation report. When I opened it using print layout designer, it looks like the report is not built using query, but I am not sure yet. This is very confusing. I created query similar with manage previous reconciliation (MPR), but when I link the query to print layout and try to make similar format/appearance with MPR report (reconciliation management (system)), it is not success.
Isn't the MPR report built not based on query ? I appreciate your answer. TIA
Rgds,

Hi,
I am not sure I understand what's the problem:
Is it the layout that is different or the data?
Regarding the data you can use SQL Profiler (maybe you did?) to find out what queries are fired, but please note that there are some stored procedures in the DB that are used for some specific functions - not sure whether the "MPR" uses any of these.
Then you must include some non-default filter in SQL Profiler...
...but you can also use the logging functionality in B1 for that purpose:
Just activate the logging (see the "log" folder in the B1 subdirectory) in the corresponding config file: choose the option to have the SQLs logged in conjunction with the logging being triggered in all cases (not just error).
Thus you will get all the SQLs - just plain - from the B1 application, but note that it will obviously slow it down!
HTH,
Frank

Help me . Query in " Query Print layout Design "

Hi Everybody .
I Design Report by Query Print layout Design , So when I run Report , I see Message : " Table not found Administrator (OA DM)" .
This is My Query .
( Note :this Query is run ok in Microsoft SQL . )
Select Cast(left([dbo].[Get_rate](T0.BatchNum,left(T0.Account,4),T1.U_VNS_JType),5) as nvarchar(50))+ Cast(T0.BatchNum as nvarchar(50))As No_Number , T0.TaxDate As Date , case left(T0.Account,4)when '1112'then '0.00' when '1122'then'0.00' else [dbo].[Get_11](T0.BatchNum,left(T0.Account,4),T1.U_VNS_JType)end as Amount1 , case left(T0.Account,4) when '1111'then '0.00' when '1121' then '0.00' else [dbo].[Get_111](T0.BatchNum,left(T0.Account,4),T1.U_VNS_JType) end As Amount2 , T1.U_VNS_MEMO As U_VNS_MEMO, T1.U_VNS_VNUMBER as PV_No , T1.U_VNS_JType as 'Voucher Type' , T0.Account As AC_Code , T3.AcctName as Description , T0.Debit As Debit ,T0.Credit As Credit , T1.U_VNS_NAME, T0.U_VNS_REMARKS From BTF1 T0 Inner Join OBTF T1 On T0.BatchNum = T1.BatchNum Inner Join OBTD T2 On T0.TransID = T2.BatchNum Inner Join OACT T3 On T0.Account = T3.AcctCode Where T0.BatchNum = '[%0]' Group by Cast(left([dbo].[Get_rate](T0.BatchNum,left(T0.Account,4),T1.U_VNS_JType),5) as nvarchar(50))+ Cast(T0.BatchNum as nvarchar(50)) , T0.TaxDate , case left(Account,4)when '1112' then '0.00' when '1122'then'0.00' else [dbo].[Get_11](T0.BatchNum,left(Account,4),T1.U_VNS_JType)end , case left(Account,4) when '1111'then '0.00' when '1121' then '0.00' else [dbo].[Get_111](T0.BatchNum,left(Account,4),T1.U_VNS_JType) end , U_VNS_MEMO , T1.U_VNS_VNUMBER , T1.U_VNS_JType , Account , AcctName , T1.U_VNS_NAME, T0.U_VNS_REMARKS order by Amount1 desc
Please help me .
Thank you very much .
Message was edited by:
Tran Ba Hai

Note: This Quey if I change = [%0] by = 1 , and I run Report in SAP is ok .

How to use query print layout design

i have a sql query and i want to see its result on report with the help of print layout design.

In addition to Tuvia's answer, here is the printing procedure of query PLD:
Printing User-Defined Queries
Use
After you have linked a user-defined query to a user report template, you can print it according to its linked print layout.
Procedure
To print a user-defined query, use one of the following two procedures:
Using the Query Print Layout window:
1. Choose Tools u2192 Queries u2192 Query Print Layout.
2. Choose the Reports tab page and select the query you would like to print.
3. Choose File u2192 Print.
The user-defined query is printed according to its linked print layout.
Using the Queries Manager window:
1. From the toolbar, choose with the quick info text Queries Manager.
2. Select the query you would like to print.
3. Choose File u2192 Print.
The user-defined query is printed according to its linked print layout.
You can also display a print preview for user-defined queries. To do so, choose File u2192 Print Preview.
Printing User-Defined Queries with Variables
Use
When a user-defined query contains variables, its linked print layout will also display the variables data and print them.
In the print layout linked to that query, you can see that an additional area containing the condition's parameters was added
There is pdf file relate to Query PLD in the SAP service marketplace website.
Rgds,

Print Layout Designer - inconsistent output

Hi,
We have received consistent compaint from our client that the output of Print Layout Designer are inconsistent.
Eg: The same PLD template is used for An invoice print out from 2 different workstation. However, workstation A display the format properly, workstation B will have missing lines between boxes or the alignment is not displayed properly.
We have also recently encountered the problem that our client export the invoice to Acrobat and then print it. However, it displays properly for workstation with Acrobat version 8, 9, but missing lines for version 7.
Another scenario could be the form is displayed properly on the screen, but the physical print out to a printer is not consistent.
We really appreciate some share of thoughts here. Is switching to other report writer, eg: Crystal Report, the only option?
Edited by: Shwu Hua Gan on Aug 10, 2008 2:57 AM

Gordon,
Thanks for replying.
This is what happen to our client.
The font size of the customised PLD SAP Invoice is size 5. In order to preview the layout, they have to preview in PDF, once they are happy with the details and then print.
In some workstations, there are Adobe Reader version 8 or 9. In a couple of workstations, there are Adobe Acrobat version 9.
Let's say, there are 2 fields with the following properties:
Field A, Left = 0, Width = 10.
Field B, Left = 10, Width = 10.
Adobe Acrobat version 9 display the border of the field properly. However, those with Adobe Reader 8 / 9 will see gaps between fields.
If we change them as follows the field the gap;
Field A, Left = 0, Width = 10.
Field B, Left = 9, Width = 11,
Then those with Adobe Acrobat version 9 is missing the border for because Field A overlaps with Field B. But Adobe Reader 8/9 will print fine. It also works fine if user click 'Print Preview' as normal and then click 'Print'
Does anyone knows whether this inconsistencies is caused by
- printer drivers; or
- Adobe; or
- SAP Business One.

Print layout design : Very Queer

Hi all .
In SAP B1 , I see some report is very queer , for ex : in journal entry , click Print layout design , I see journal entry (system) , double click it to open design , Queer in here , in repetitve area , field : Debit , Credit , data source is free text , but when I view report , I see infor by Debit , Credit , Normaly , Field must has source type is database , formular, or system , it will has information .
Please explain to me about queer .
Thanks very much .

Hi
check this link and search for demo's on
Print Layout Designer
https://www.sdn.sap.com/irj/sdn/businessone-elearning
I hope this helps you out
regards,
Shreyas

Print layout design

hi friends,
using print layout design i am getting reports for a purchased item with all types of taxes included.
i want to display the total cost of same purchased items but more than one and each purchased items having different taxes included with it.
Example:
product1:
cost price:Rs100
tax:4%
total cost price:Rs104
Product1:
cost price:Rs100
tax:5%
total cost price:Rs105
i want to have final report as:
product1
total cost price:Rs209.
in 2005 .B version
so please help me out....
regards,
varalakshmi.

Hi,
If you want to create a base on tax rate, you can, First, goto to Sort and from the Sort properties, set/sort the Product to by ascending the do not check the summarize, then choose the Field where the tax is then check the Summarize then ok.
In you report proper, make a formula for the rate with Content : Concat(Field_rate) then put from the Group values as '1' then uncheck visible, then create a your report since the rate is not visible it will group according to rate and sort according to product.
regards,
Clint

Print Layout Designer \Custom Reports

Hello All,
Is there a way to set a custom report as default in the Print Layout Designer for A/R Invoice in SAP B1 ?
Thank you and Best wishes and Happiness in the New Year 2009.
Ben

Hello All,
Thank you for your answer but I would like to be more exact in my question because I already know how to set a Print Layout as default in a screen of SAP B1 like A/R Invoice by the way that Parlati has mentioned :
1. Open a blank AR Invoice (e.g. service or item type)
2. Click on Menu >> Tools >> Print Layout Designer... or pen icon on toolbar
3. With The Document Type selected - choose template and click on Set as Default
But I usually use the Query Manager Tool of SAP B1 to create new queries and reports and I use the Print Layout Designer to setup the layout of these reports. These reports are printed normally via the print preview Icon of the toolbar. But now I would like to know how can I set one of these Reports as default in A/R Invoice screen of SAP. Because it's a one of my customized Invoices.
Is there a way to do this?
Thank you.
Ben.

Print Layout Designer

Hi, I want to create one report for sales invoice using 'Print Layout Designer'.
1. Some fields like Price, Tax Amount are not picking up from Table, rather 'variable' is being used for them. So how to use these variables and on what basis variable number is defined????????
2. If I have defined one new taxcode(for example Insurance with rate 0.75), then how can I display the tax amount on report??????/

exactly,
then you can use query assistant to create a customized query
ciao

Print Layout Designer...........Help

Hi
Please help me to get a way to load the TIN number (already entered in - BusinessPartner master Data Form and saved in -CRD7 database table for customers) into the PLD Report as customers TIN number (means in the Report creation using Print Layout Designer). Here I want to access the CRD7 table in the PrintLayoutDesigner>Properties>Content-->Database.Is this Possible?

Dear
The workaround could be that creating UDF and FMS to get
those information , and thus in PLD.
Best Regards,
Xiaodan AN

Print Layout Designer Preview

Hi experts,
We have a report using the Print Layout Designer, before printing it we view it first. When we preview the report, amounts can't be seen fully however, when we pint it, it's complete. Why is this so? Hope you could give me response in soonest.
Thanks,
Kathy

Hi Kathy,
If your print results do not match your printer preview, it always links issue with different printer driver. It is OK as long as your printing results are good. If I were you, I would only care about the actual printing results. That is because, you may have different printers to use. All of them may have slightly different results.
Thanks,
Gordon

Print Layout Designer question

In Trial Balance there is a checkbox that I can select to "Hide Titles", but this same checkbox is not available in the Trial Balance Budget Report. How can I hide the titles for Trial Balance Report in Print Layout Designer? (Hide Titles is variable 156)
Any help is appreciated, thank you.

The Titles get dynamically populated to the Account Name field on the PLD. Without the Hide Titles check box there is no logic to intelligently hide just the Titles. If you hide this field on the PLD all account names would be hidden.

Div layout design

Similar Messages

Maybe you are looking for