Re: [BlueGriffon] Centering Page
580 views
Skip to first unread message
Greg Chapman
Oct 23, 2012, 4:40:26 AM10/23/12
to blueg...@googlegroups.com
Hi Coony,
On 22 Oct 12 23:41 Coony <stew....@gmail.com> said:
> I am having trouble making the page center into web browser. Can
> anyone help me with this
The conventional method is to create a <div> to act as a wrapper for
the page content and add the styling rules required.
Do this:
1. Hit CTRL-A (to select entire page content)
2. Hit CTRL-X (to cut entire page content)
3. On the formatting toolbar, open the paragraph styling drop-down
list and select "Generic container <div>"
4. Hit CTRL-V (to paste the page content within the newly created
<div> tag)
5. On the Status line (aka "Tag bar") click on the <div> tag (to
select the wrapper)
6. On the Menu bar open Panels > Style Properties (to open the Style
Properties Panel)
7. On the panel, ensure the "Apply styles to:" field says "this
element through its ID" then open the "Geometry" section of the panel.
8. Open the Geometry section of the panel and enter a value for the
width - e.g. 960px (The Enter ID dialogue opens.)
9. Enter an ID name in the dialogue and click OK (Suggest: "wrapper")
10. Under Margins: clear the "Same four margins" box (to open the four
separate fields)
11. On the left and right margin fields select "Automatic"
Job done!
Notes:
# This process produces a new internal stylesheet (or adds the style
rule to an existing internal stylesheet) that will automatically
equalise the left and right margins, effectively centering the
contents of the wrapper.
# Ideally this style rule should be exported to a linked stylesheet so
it can be easily applied to all pages.
Greg Chapman
http://www.gregtutor.plus.com
Helping new users of KompoZer and The GIMP
Still exploring BlueGriffon
On 22 Oct 12 23:41 Coony <stew....@gmail.com> said:
> I am having trouble making the page center into web browser. Can
> anyone help me with this
The conventional method is to create a <div> to act as a wrapper for
the page content and add the styling rules required.
Do this:
1. Hit CTRL-A (to select entire page content)
2. Hit CTRL-X (to cut entire page content)
3. On the formatting toolbar, open the paragraph styling drop-down
list and select "Generic container <div>"
4. Hit CTRL-V (to paste the page content within the newly created
<div> tag)
5. On the Status line (aka "Tag bar") click on the <div> tag (to
select the wrapper)
6. On the Menu bar open Panels > Style Properties (to open the Style
Properties Panel)
7. On the panel, ensure the "Apply styles to:" field says "this
element through its ID" then open the "Geometry" section of the panel.
8. Open the Geometry section of the panel and enter a value for the
width - e.g. 960px (The Enter ID dialogue opens.)
9. Enter an ID name in the dialogue and click OK (Suggest: "wrapper")
10. Under Margins: clear the "Same four margins" box (to open the four
separate fields)
11. On the left and right margin fields select "Automatic"
Job done!
Notes:
# This process produces a new internal stylesheet (or adds the style
rule to an existing internal stylesheet) that will automatically
equalise the left and right margins, effectively centering the
contents of the wrapper.
# Ideally this style rule should be exported to a linked stylesheet so
it can be easily applied to all pages.
Greg Chapman
http://www.gregtutor.plus.com
Helping new users of KompoZer and The GIMP
Still exploring BlueGriffon
Dominik Lenné
Oct 27, 2012, 8:44:56 AM10/27/12
to blueg...@googlegroups.com
Hi,
one can even give the html-tag a background-color or -image and the body-tag width and centering with margin: auto;
like that
<html style="background-color: #A8A8A8;">
<head>
<style>
body {width: 800px; background-color: #FF7837; margin: auto; height: 100%;}
#content {width: 500px; margin: 50px; }
</style>
</head>
<body>
<div id="content">
<p>Life is beautiful. They say. If one were in love at least. </p>
</div>
</body>
</html>
This works even with an external style sheet in my Firefox. I didn't test it with other browsers though. And I don't know how to give the HTML-tag a style via style-console.
one can even give the html-tag a background-color or -image and the body-tag width and centering with margin: auto;
like that
<html style="background-color: #A8A8A8;">
<head>
<style>
body {width: 800px; background-color: #FF7837; margin: auto; height: 100%;}
#content {width: 500px; margin: 50px; }
</style>
</head>
<body>
<div id="content">
<p>Life is beautiful. They say. If one were in love at least. </p>
</div>
</body>
</html>
This works even with an external style sheet in my Firefox. I didn't test it with other browsers though. And I don't know how to give the HTML-tag a style via style-console.
JMF Gmail
Oct 29, 2012, 7:00:44 AM10/29/12
to blueg...@googlegroups.com
Hi,
I apologize if the question was already put and solved.
I meet a problem with Bluegriffon:
When I make a mofdification in the source code, it is not taken into account in the page Web editor.
Thank you for your help
Jean-Marie F
I apologize if the question was already put and solved.
I meet a problem with Bluegriffon:
When I make a mofdification in the source code, it is not taken into account in the page Web editor.
Thank you for your help
Jean-Marie F
Greg Chapman
Oct 29, 2012, 1:46:07 PM10/29/12
to blueg...@googlegroups.com
Hi JMF,
On 29 Oct 12 11:00 JMF Gmail <jmfo...@gmail.com> said:
> When I make a mofdification in the source code, it is not taken into
> account in the page Web editor.
You'll need to give a more precise description of the problem.
It could be that you are adding inappropriate code snippet for the
DOCTYPE of the page you have. In such a case BlueGriffon might discard
the code you add.
Ideally, post the URL of a sample page which exhibits the problem.
Make sure you describe the exact edit you make.
On 29 Oct 12 11:00 JMF Gmail <jmfo...@gmail.com> said:
> When I make a mofdification in the source code, it is not taken into
> account in the page Web editor.
It could be that you are adding inappropriate code snippet for the
DOCTYPE of the page you have. In such a case BlueGriffon might discard
the code you add.
Ideally, post the URL of a sample page which exhibits the problem.
Make sure you describe the exact edit you make.
Reply all
Reply to author
Forward
0 new messages