coding question

[Elsie]

i'm not sure if this is the right section, cos it says it's for help with coding, but not for "how do i do this" questions, which seems like a contradiction, but there ya go......


i have some code for feature on my vbulleting site (see below) but altho it is all centred in IE, it is not centred in firefox. anyone know how i get round this?

(the div align="center" relates to the text within the frame, but it's the whole thing i'm trying to get centred)

thanks for any help!




<fieldset style="width:55%" span align=center class="fieldset">
<legend>$vbphrase[countdown_title]</legend>

<div align="center"><strong>$vbphrase[countdown_counting_down_to]:</strong> $event <br />
<em>$counter</em></div>
</span>

</fieldset>

[Noppid]

Simple typo?



<fieldset style="width:55%"><span style="text-align:center" class="fieldset">
<legend>$vbphrase[countdown_title]</legend>

<div align="center"><strong>$vbphrase[countdown_counting_down_to]:</strong> $event <br />
<em>$counter</em></div>
</span>

</fieldset>


fieldset was not closed and span not open. I changed the align to css. (is it right?) LOL

[Coder1]

I know this is true for JavaScript, but cannot remember if the same rule applies with CSS: do the declarations require a terminal semi-colon?


<span style="text-align:center;" class="fieldset">

[Noppid]

I know this is true for JavaScript, but cannot remember if the same rule applies with CSS: do the declarations require a terminal semi-colon?


<span style="text-align:center;" class="fieldset">

That would be the case. But one will work without the semi.

[Elsie]

making the suggested changes makes it move to the left in IE (it was centred before).

can't speak for firefox as i don't use it. i'd have to check with the member who does. but in the meantime, any further thoughts?

[Noppid]

Define "it". What moves left? Oh yeah, and IE sucks. You really need to use both just for this type thing alone. Beyond that, IE is fine to stick with. Look at it yourself in FF though. ;)



<fieldset style="width:55%;style="text-align:center""><span style="text-align:center" class="fieldset">
<legend>$vbphrase[countdown_title]</legend>

<div style="text-align:center"><strong>$vbphrase[countdown_counting_down_to]:</strong> $event <br />
<em>$counter</em></div>
</span>

</fieldset>


As for <em> and <strong>, read this. http://www.w3schools.com/tags/tag_phrase_elements.asp

[Elsie]

"it" = the whole thing.

making that change has no effect in IE. i'll consider firefox for test purposes.

the coding isn't mine, btw, it's a vb hack/product and so i'm just into adapting it for my needs (or trying to anyway!).

[Noppid]

Yeah, it's not unususual to have to fix code like that. I don't have this live, so I can't see what it's doing.

[Elsie]

not to worry - i have someone looking into it for me as we speak :)


if that fails, i'll be back with a screenshot!

[Elsie]

ok this is now solved :) thanks for the input people!

the final code looks like this:


<center>
<fieldset style="text-align:center;width:55%;margin:auto;">

<legend>$vbphrase[countdown_title]</legend><strong>$vbphrase[countdown_counting_down_to]:</strong> $event<br /><em>$counter</em></fieldset>

</center>

[Noppid]

There is no <center> tag in XHTML. You should use a different element to center that with CSS. But that's up to you.

[Peggy]

lol... sounds familiar

[Elsie]

i tried spans but they didn't work. i'm happy with what i've got as long as it does what i want it to do - which it does. :)

[Noppid]

Problem is, people will notice your XHTML don't validate. If this is a hack or a style, you are breaking vBulletin and that is not acceptable. :)

What I mean is that vBulletin is XHTML and <center> is not valid in XHTML. It will work, but in the big picture, it is not correct. There will be more then one right way to do it in XHTML as well.

It's worth the extra effort to learn the subtle differences and to try and use CSS where ever you can. Once you get it, you'll love it.

Like a said, it's not the end of the world if you do it. But, if this is for vBulletin, and because our topic is vBulletin, I want it to be known we shouldn't use <center> tags.

[Elsie]

what is the xhtml equivalent to the <center> attribute? or at least, if there are various methods, what is the most common one?

[Elsie]

i've changed it to:


<style="text-align:center">


<fieldset style="text-align:center;width:55%;margin:auto;">

<legend>$vbphrase[countdown_title]</legend><strong>$vbphrase[countdown_counting_down_to]:</strong> $event<br /><em>$counter</em></fieldset>

</style>

not sure whether that's xhtml or css, but would you say it's a more acceptable form?

[Coder1]

Yes.

The central dogma of xhtml and css is that old-fashioned HTML mixed content and presentation. It isn't supposed to, and each browser company ended up making proprietary tags for all sorts of crazy things. Nasty. Bad old days.

Now, XHTML is about content and structure. Headings go in header tags. Tables go in tables. Lists go in lists. But if you want your headings to be red Verdana 14 pt, floated left, and your tables to have 2pt thick light blue borders, and your lists to look and act like menus, you do that with CSS.

So, (whew), "center" doesn't describe a document element or content. Thus, there is no "center" element. If there IS an element which you want to be centered, you use CSS.

There ya have it.

[Elsie]

clear as mud! thanks tgreer!! :D

[Coder1]

XHTML is your face. CSS is the makeup you put on your face.

One is structural: eyes here, nose there, ears here and here, so many teeth in the mouth. Hair.

The other is cosmetic: color, and even deeper changes like re-aligning the teeth or changing eye color with contacts.

[Elsie]

aha. i see :)


if only you *could* do that to your face!! lol

[Peggy]

lol