Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Fieldset CSS Centering

Reply
Thread Tools

Fieldset CSS Centering

 
 
effendi@epitome.com.sg
Guest
Posts: n/a
 
      03-14-2006
I created a CSS file which defined the attributes of my fieldset.
However, inspite of trying various combination, I cannot "centre" my
fieldset, it is flushed to the left.

Here is my CSS file.

body {
text-align:center; /* for IE */
align:center;
}
div#formfields { width:800px;
align:center
}

fieldset {
background-color: #E3EEF7;
width:800px; /* or a percentage, or whatever */
margin-bottom: 10px
align:center
}


TEXTAREA {
font-weight : Normal;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
border-color : 888888;
border-style : solid;
border-width : 1px;
Font-color : 000000;
display: block;
width: 498px;
float: left;
margin-bottom: 10px;
}

INPUT, Select {
font-weight : Normal;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
border-color : 888888;
border-style : solid;
border-width : 1px;
Font-color : 000000;
display: block;
width: 150px;
float: left;
margin-bottom: 10px;
}

..Buttons{
align:center
}


label{
width: 150px;
font-size: 11px;
text-align: right;
width: 150px;
float: left;
padding-right: 20px;
display: block;
margin-bottom: 10px
}


br {
clear: left;
}


td {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #333333;
text-decoration: none;
}

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #333333;
text-decoration: none;
}

tr {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #333333;
text-decoration: none;
}

a:link { font-family: Arial, Helvetica, sans-serif; font-style:
normal; color: #666666}
a:visited { font-family: Arial, Helvetica, sans-serif; font-style:
normal; color: #820034}
a:active { font-family: Arial, Helvetica, sans-serif; font-style:
normal; color: #666666}


Can any tell me what I did wrong?

Thanks in advance

 
Reply With Quote
 
 
 
 
Steve Pugh
Guest
Posts: n/a
 
      03-14-2006
http://www.velocityreviews.com/forums/(E-Mail Removed) wrote:

>I created a CSS file which defined the attributes of my fieldset.
>However, inspite of trying various combination, I cannot "centre" my
>fieldset, it is flushed to the left.
>
>Here is my CSS file.
>
>body {
>text-align:center; /* for IE */
>align:center;
>}
>div#formfields { width:800px;
>align:center
>}


There's no such CSS property as align.

>fieldset {
>background-color: #E3EEF7;
>width:800px; /* or a percentage, or whatever */
>margin-bottom: 10px
>align:center
>}


>Can any tell me what I did wrong?


You made up a CSS property.

To center a block set the margin-left and margin-right properties to
auto. Works in all modern and semi-modern browsers (even IE6 if you
trigger Standards mode).

Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
 
 
 
effendi@epitome.com.sg
Guest
Posts: n/a
 
      03-15-2006
Steve,

Thanks, I removed the align: center. However,it doens't seem to have
any effect. I believe its due to the IE issue. How do you open IE in
Standard more?

 
Reply With Quote
 
Toby Inkster
Guest
Posts: n/a
 
      03-15-2006
effendi wrote:

> Thanks, I removed the align: center. However,it doens't seem to have
> any effect. I believe its due to the IE issue. How do you open IE in
> Standard more?


I assume the question is one about Standards mode and Quirks mode.

Try: http://gutfeldt.ch/matthias/articles/doctypeswitch.html

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact

 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      03-15-2006
(E-Mail Removed) wrote:


>Thanks,


For what? Please quote the post you are replying to.

>I removed the align: center.


Did you add anything as well?

> However,it doens't seem to have
>any effect. I believe its due to the IE issue.


WEll did you test in browsers other than IE?

> How do you open IE in
>Standard more?


You include a doctype that triggers standards mode on the first line
of your document? See http://hsivonen.iki.fi/doctype/

Any more help will need a URL.

Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
effendi@epitome.com.sg
Guest
Posts: n/a
 
      03-15-2006
Thanks to Steve and Toby

To answer Steve, yes I tired in Firefox and the alignment was ok. I
finally found that the source of my problem was this piece of code:-

div#formfields { width:800px;
>align:center
>}



I removed that and all the elements were centred.

The only problem I am still facing is the fact that my buttons are
still left aligned. In spite of the fact that I gave the butons a clas
called "buttons"

with the following code


Input.Buttons{
color:#050;
font-family:'trebuchet ms',helvetica,sans-serif;
font-size: 11px;
margin-left: auto
margin-right: auto
}

 
Reply With Quote
 
PeterMcC
Guest
Posts: n/a
 
      03-15-2006
(E-Mail Removed) wrote in
<(E-Mail Removed). com>

> Thanks to Steve and Toby
>
> To answer Steve, yes I tired in Firefox and the alignment was ok. I
> finally found that the source of my problem was this piece of code:-
>
> div#formfields { width:800px;
>> align:center
>> }

>
>
> I removed that and all the elements were centred.
>
> The only problem I am still facing is the fact that my buttons are
> still left aligned. In spite of the fact that I gave the butons a clas
> called "buttons"
>
> with the following code
>
>
> Input.Buttons{
> color:#050;
> font-family:'trebuchet ms',helvetica,sans-serif;
> font-size: 11px;
> margin-left: auto
> margin-right: auto
> }


Missing semi-colon?

--
PeterMcC
If you feel that any of the above is incorrect,
inappropriate or offensive in any way,
please ignore it and accept my apologies.
 
Reply With Quote
 
Steve Pugh
Guest
Posts: n/a
 
      03-15-2006
"PeterMcC" <(E-Mail Removed)> wrote:
>(E-Mail Removed) wrote in
><(E-Mail Removed) .com>


>> The only problem I am still facing is the fact that my buttons are
>> still left aligned. In spite of the fact that I gave the butons a clas
>> called "buttons"
>>
>> with the following code
>>
>>
>> Input.Buttons{
>> color:#050;
>> font-family:'trebuchet ms',helvetica,sans-serif;
>> font-size: 11px;
>> margin-left: auto
>> margin-right: auto
>> }

>
>Missing semi-colon?


That and the fact that margin: auto won't center inline elements like
input. And based on what the OP has literally written there's also the
mismatch between class="buttons" and .Buttons. Without a URL, who
knows?

And that's not even getting into the other problems like pixels for
font size and colour with no background colour.

Steve
--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Fieldset not showing Peter Smit HTML 9 01-20-2007 06:54 PM
Getting Drillthrough result from pivottable fieldset =?Utf-8?B?a3N0cml5aG9u?= ASP .Net 4 07-25-2005 03:52 PM
<fieldset> tag =?Utf-8?B?SSBhbSBTYW0=?= ASP .Net 0 05-24-2005 07:53 PM
<fieldset> & CSS luke HTML 2 03-14-2005 05:20 AM
div within fieldset - validation error advice RobM HTML 19 11-16-2004 05:03 AM



Advertisments