6 Apr
2008
6 Apr
'08
2:18 a.m.
Hi all,
Please has any body know hot to center <div id="xwikimaincontainer">? I
am working with a customized network based on toucan. XE 1.3. And I am
not able to figure out how to do that. Thanks!
Ricardo
--
Ricardo Rodríguez
Your EPEC Network ICT Team
6 Apr
6 Apr
noon
Heya Ricardo,
The <div id="xwikimaincontainer"> is centered automatically when you
either do not use any panels, or use both left and right panels.
Mazzel,
Martijn.
7 Apr
7 Apr
12:12 p.m.
Hi Martin!
martijn.ras wrote:
The <div id="xwikimaincontainer"> is centered automatically when you
either do not use any panels, or use both left and right panels.
Thanks for the input!
But I am not so sure about this "centered automatically" behaviour. For
instance, in a "no side panels" scenario, fix max-width for body (you will
find it under /* @group Layout */. Let's say max-width:800. This class will
read:
/* @group Layout */
body{
font-size: 87.5%; /* 10px */
font-family: sans-serif;
color: #222;
width: 100%;
padding: 0;
margin: 0 ;
max-width: 900px;
background-image: url( images/colors/gray/H4x4-GRAY.png );
background-color: #fff;
}
At least for me here (several browsers), the "main frame", the area with
contents, is not centered but aligned left.
The result is the same whatever layout you choose. Really it looks as
expected as I am not able to find code that must center it.
But the problem is that I am not able to find how to do that. The auto
margin trick is failing. Perhaps the problem is to find what is the DIV we
have to reference to get this one centered. Anyway, I keep trying and
posting here any positive result.
Mazzel,
--
View this message in context:
http://www.nabble.com/centering-a-DIV-tp16519663p16537212.html
Sent from the XWiki- Users mailing list archive at Nabble.com.
12:32 p.m.
[Ricardo Rodríguez] wrote:
Hi Martin!
martijn.ras wrote:
This almost works (in intelligent browsers):
#xwikimaincontainer {
width: 800px;
margin: auto !important;
}
To make it work in IE also, something like this should work (can't test
as I don't have IE):
#body {
text-align: center;
}
The problem is that the background X is not suited for this kind of layout.
--
Sergiu Dumitriu
http://purl.org/net/sergiu/
The <div id="xwikimaincontainer">
is centered automatically when you
either do not use any panels, or use both left and right panels.
Thanks for the input!
But I am not so sure about this "centered automatically" behaviour. For
instance, in a "no side panels" scenario, fix max-width for body (you will
find it under /* @group Layout */. Let's say max-width:800. This class will
read:
/* @group Layout */
body{
font-size: 87.5%; /* 10px */
font-family: sans-serif;
color: #222;
width: 100%;
padding: 0;
margin: 0 ;
max-width: 900px;
background-image: url( images/colors/gray/H4x4-GRAY.png );
background-color: #fff;
}
At least for me here (several browsers), the "main frame", the area with
contents, is not centered but aligned left.
The result is the same whatever layout you choose. Really it looks as
expected as I am not able to find code that must center it.
But the problem is that I am not able to find how to do that. The auto
margin trick is failing. Perhaps the problem is to find what is the DIV we
have to reference to get this one centered. Anyway, I keep trying and
posting here any positive result.
Mazzel,
8 Apr
8 Apr
12:02 a.m.
Hi,
Sergiu Dumitriu wrote:
> This almost works (in intelligent browsers):
>
> #xwikimaincontainer {
> width: 800px;
> margin: auto !important;
> }
>
> To make it work in IE also, something like this should work (can't test
> as I don't have IE):
>
> #body {
> text-align: center;
> }
>
> The problem is that the background X is not suited for this kind of layout.
>
I am trying this solution and I am not able to get it working (perhaps
this is included in your "almost"!). I concentrate first in "intelligent
browsers", Firefox, OmniWeb and Safari included. I am adding...
#xwikimaincontainer {
width: 800px;
margin: auto !important;
}
to the Style.css included in a XWiki.XWikiSkins object (customized
skin). #xwikimaincontainer is added to the bottom of the record. Width
works like a charm. Any other margin option works without a glitch. But
auto doesn't produce the expected effect.
The only reason I can figure out is that this is not the only class
affecting position of #xwikimaincontainer and there is another class
prevailing that sets border to 0pt. In this case, my doubt is why does
other border settings work?
Here what I see in Firebug...
<html lang="en" xml:lang="en"
xmlns="http://www.w3.org/1999/xhtml">
<head>...</head>
<body id="body" class="xwiki_test01 viewbody
hidelefthideright">
<div id="xwikimaincontainer">
<div id="xwikimaincontainerinner">
</div>
</div>
</body>
</html>
I interpret that only #xwikimaincontainer class must affect
xwikimaincontainer div position, but it is obviously wrong.
I do need to improve my CSS skills (among many other things...)! Any
help will be really welcome to work out this issue. Thanks.
Cheers,
Ricardo
--
Ricardo Rodríguez
Your EPEC Network ICT Team
6063
days inactive
6064
days old
4 comments
4 participants
participants (4)
-
[Ricardo Rodriguez] Your EPEC Network ICT Team -
[Ricardo Rodríguez]
-
Martijn.Ras -
Sergiu Dumitriu