By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,089 Members | 1,964 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,089 IT Pros & Developers. It's quick & easy.

Hide input text

P: n/a
I what to hide an input element and the following text. I have the
selector for the input working and just need to grab the text following
it.

CSS:

form{
display:table;
text-align:center;
}
form>input[value="0"][name="denominator"]{
visibility:hidden;
}

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" type="text/css" href="testf1.css" media="all"/>
</head>
<body xmlns="http://www.w3.org/1999/xhtml" whole="0">
<form class="fraction">
<input type="radio" name="numerator" value="0" checked="checked"/>0
<input type="radio" name="numerator" value="1"/>1
<input type="radio" name="numerator" value="2"/>2
<input type="radio" name="numerator" value="3"/>3
<hr/>
<input type="radio" name="denominator" value="0"/>0
<input type="radio" name="denominator" value="1"/>1
<input type="radio" name="denominator" value="2"/>2
<input type="radio" name="denominator" value="3" checked="checked"/>3
</form>
</body>
</html>

http://emle.sourceforge.net/emle020000/testf1.xml
http://emle.sourceforge.net/emle020000/testf1.xsl
http://emle.sourceforge.net/emle020000/testf1.css

--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 1 '07 #1
Share this Question
Share on Google+
11 Replies


P: n/a
On May 1, 11:42 am, "C.W.Holeman II" <cwhii_google_s...@yahoo.com>
wrote:
I what to hide an input element and the following text. I have the
selector for the input working and just need to grab the text following
it.
<input type="radio" name="numerator" value="0" checked="checked"/
><span>0</span>
form>input[value="0"][name="denominator"],form>input[value="0"]
[name="denominator"]+span{
visibility:hidden;
}

or:
<input type="radio" name="numerator" value="0" checked="checked"/>

form>input:after {content:attr(value) }
form>input[value="0"][name="denominator"],form>input[value="0"]
[name="denominator"]:after{
visibility:hidden;content:""
}

May 1 '07 #2

P: n/a
Scripsit C.W.Holeman II:
I what to hide an input element and the following text.
What?
I have the selector for the input working
No you don't. It contains several constructs not supported by IE 6, which is
still the most common browser.
and just need to grab the text following it.
Wrap the text inside an element and develop a suitable selector.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
That's pointless.
<body xmlns="http://www.w3.org/1999/xhtml" whole="0">
<form class="fraction">
You don't comply with the XHTML 1.0 specification, or any HTML
specification. There's an invented 'whole' attribute in <body>, and the
required 'action' attribute is missing from the <formtag,
<input type="radio" name="numerator" value="0" checked="checked"/>0
<input type="radio" name="numerator" value="1"/>1
<input type="radio" name="numerator" value="2"/>2
<input type="radio" name="numerator" value="3"/>3
You should wrap interrelated radio buttons inside a <fieldsetelement, and
you should associate labels with fields in markup, e.g.

<div class="dummy"><label><input type="radio" name="numerator" value="0"
checked="checked"/>0</label></div>

Then you can simply use
..dummy { visibility: hidden; }

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

May 1 '07 #3

P: n/a
Jukka K. Korpela wrote:
Scripsit C.W.Holeman II:
>I what to hide an input element and the following text.

What?
An introduction with specific details shown below it.
>I what to hide
visibility:hidden;
>an input element
form>input[value="0"][name="denominator"]
>and the following text.
<input type="radio" name="denominator" value="0"/>0
<input type="radio" name="denominator" value="1"/>

After the input element, the text following it, in this case the "0".
>
>I have the selector for the input working

No you don't. It contains several constructs not supported by IE 6,
I forgot to include:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.3)
Gecko/20070309 Firefox/2.0.0.3

Windows Internet Explorer Version: 7.0.5730.11

The example I created produced the effect I am asking about on both of
the above browsers: they displayed two rows of radio buttons with the
buttons and text aligned vertically and the "0" denominator button was
hidden but the "0" text was visible.
which is still the most common browser.
I am not near the point of considering how that will effect what I am
doing. What is now the "most common browser" may be different or
irrelevant by release time.
>and just need to grab the text following it.

Wrap the text inside an element and develop a suitable selector.
I am hoping to not have to add that. If there is some selector that
will work without adding something like a span I would prefer to
understand that method.
><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

That's pointless.
From http://www.w3.org/TR/xhtml1/ Section 3.1.1.
4. There must be a DOCTYPE declaration in the document prior to the
root element. The public identifier included in the DOCTYPE
declaration must reference one of the three DTDs found in DTDs using
the respective Formal Public Identifier. The system identifier may be
changed to reflect local system conventions.
...
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
You don't comply with the XHTML 1.0 specification, or any HTML
specification.
I created a fragment to make it as easy as possible for readers to
follow my question.
There's an invented 'whole' attribute in <body>,
I caught that in http://emle.sourceforge.net/emle020000/testf1.xsl
but missed it in the text of the posting.
and the required 'action' attribute is missing from the <formtag,
I created a fragment to make it as easy as possible for readers to
follow my question. The two browsers I tested the example on appeared to
not be effected by the simplification.
> <input type="radio" name="numerator" value="0" checked="checked"/>0
<input type="radio" name="numerator" value="1"/>1
<input type="radio" name="numerator" value="2"/>2
<input type="radio" name="numerator" value="3"/>3

You should wrap interrelated radio buttons inside a <fieldsetelement,
and you should associate labels with fields in markup, e.g.
The sample I am using is just a fragment. Thank you for the reference to
<fieldsetwhich I did not know about. Is the <fieldsetelement some
how needed or related to the issue of hiding the "0"?
>
<div class="dummy"><label><input type="radio" name="numerator" value="0"
checked="checked"/>0</label></div>

Then you can simply use
.dummy { visibility: hidden; }
Yes, that works. If that is the only solution I will use it but I would
like to not have to create an name like "dummy" to tie the XSL content
to the CSS file.

--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 2 '07 #4

P: n/a
Scripsit C.W.Holeman II:
Jukka K. Korpela wrote:
>Scripsit C.W.Holeman II:
>>I what to hide an input element and the following text.

What?

An introduction with specific details shown below it.
What I wondered wasn't so much the details or the meaning of "what", which
is probably "want", but rather _why_ you would do such things. I can make
some guesses, but the idea of hiding the dummy preselected alternative -
which is probably what you are trying to achieve - is questionable. When
it's hidden, a normal user has no way of restoring the setting to that
default, except by destroying the entire input data by using an eventual
destroy button (aka. "reset button").
>>I have the selector for the input working

No you don't. It contains several constructs not supported by IE 6,

I forgot to include:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.3)
Gecko/20070309 Firefox/2.0.0.3

Windows Internet Explorer Version: 7.0.5730.11
No you didn't. You forgot to check the topic of this group, which is CSS
authoring for the World Wide Web. Your personal choice of browser(s) is
ridiculously unimportant in this context. (The "ridiculously" part comes
from listing down the browsers down to the build of a variant of a minor
version.)
>which is still the most common browser.

I am not near the point of considering how that will effect what I am
doing.
Perhaps not much if you are not authoring for the WWW, but why did you post
to this group then and even claiming that something works when it clearly
doesn't in the majority of cases on the WWW?
>Wrap the text inside an element and develop a suitable selector.

I am hoping to not have to add that.
That's wrong hope. You should use label markup anyway. When you add it, it
should be rather trivial to add the markup you need for styling.
>><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

That's pointless.

From http://www.w3.org/TR/xhtml1/ Section 3.1.1.
XHTML 1.0 is pointless on the WWW, and XHTML 1.0 Transitional even more so.
Besides, you are not actually complying with the DTD given, so what's the
point?
>You don't comply with the XHTML 1.0 specification, or any HTML
specification.

I created a fragment to make it as easy as possible for readers to
follow my question.
How would invalid markup help then?

And you should have posted a URL.
The sample I am using is just a fragment.
That's one of your problems. You threw just a fragment of your problem at
us, and one that isn't even a real extract from the real page. So you should
expect to get, at most, fragments of answers.
Thank you for the reference
to <fieldsetwhich I did not know about.
It's a basic element in HTML 4.01 forms.
Is the <fieldsetelement
some how needed or related to the issue of hiding the "0"?
Maybe. Would that matter?
><div class="dummy"><label><input type="radio" name="numerator"
value="0" checked="checked"/>0</label></div>

Then you can simply use
.dummy { visibility: hidden; }

Yes, that works. If that is the only solution I will use it
With the given incomplete information, it pretty much is.
but I
would like to not have to create an name like "dummy" to tie the XSL
content to the CSS file.
Well, make it "huuhaa" then.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

May 2 '07 #5

P: n/a
Jukka K. Korpela wrote:
Scripsit C.W.Holeman II:
>Jukka K. Korpela wrote:
>>Scripsit C.W.Holeman II:

I what to hide an input element and the following text.
....
What I wondered wasn't so much the details or the meaning of "what",
which is probably "want", but rather _why_ you would do such things.
There are two rows of radio buttons which combine to specify the value
of a fraction. The bottom row is for the denominator. This should not
have a value of "0". I was displaying the "0" in order to have vertical
alignment of the buttons. I first tried just disabling the "0". This
provided the alignment but was a bit confusing for the user since it was
seen but was always disabled.
>>>I have the selector for the input working

No you don't. It contains several constructs not supported by IE 6,

I forgot to include:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.3)
Gecko/20070309 Firefox/2.0.0.3

Windows Internet Explorer Version: 7.0.5730.11

No you didn't. You forgot to check the topic of this group,
http://css.nu/faq/ciwas-mFAQ.html:
Q: What kinds of posts are acceptable in this news group ?

A: Topics for this news group include:

* How to achieve a particular effect with style sheets
which is CSS authoring for the World Wide Web.
If my question is somehow in the wrong place I would appreciate
directions to a better forum if you know of one.
Your personal choice of browser(s) is
ridiculously unimportant in this context. (The "ridiculously" part comes
from listing down the browsers down to the build of a variant of a minor
version.)
The Firefox was just a cut and paste the IE reference was typed in with
the details as a habit which in many other contexts has been helpful.
Especially when asking for free help.
>I am not near the point of considering how that will effect what I am
doing.

Perhaps not much if you are not authoring for the WWW, but why did you
post to this group then and even claiming that something works when it
clearly doesn't in the majority of cases on the WWW?
Because I am attempting to determine "how to achieve a particular effect
with style sheets" as listed in the FAQ of "What kinds of posts are
acceptable in this news group".
>>Wrap the text inside an element and develop a suitable selector.

I am hoping to not have to add that.

That's wrong hope. You should use label markup anyway. When you add it,
it should be rather trivial to add the markup you need for styling.
When I posted the question I was not aware of the label element. Using
a span with class to allow access to it seemed to be less than best.
That is why I posted the question.
>>><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

That's pointless.

From http://www.w3.org/TR/xhtml1/ Section 3.1.1.

XHTML 1.0 is pointless on the WWW, and XHTML 1.0 Transitional even more
so.
I have made a number of assumptions in order to start working with a
number of technologies that I am new to. I selected a question that I
was able to articulate. The replies from you and
sc*************@gmail.com have been helpful.
>I created a fragment to make it as easy as possible for readers to
follow my question.

How would invalid markup help then?
I left out the "required 'action' attribute" of the <formwhich reduced
the size and allowed one to focus on the effect I was asking about.
And you should have posted a URL.
Do you mean like the ones in the original post of:

http://emle.sourceforge.net/emle020000/testf1.xml
http://emle.sourceforge.net/emle020000/testf1.xsl
http://emle.sourceforge.net/emle020000/testf1.css
That's one of your problems. You threw just a fragment of your problem
at us, and one that isn't even a real extract from the real page.
Actually I took the most complete page I had which is close to these:

http://emle.sourceforge.net/emle0200...le_lab_009.xml
http://emle.sourceforge.net/emle0200...le_lab_009.xml
http://emle.sourceforge.net/emle0200...le_lab_009.xml
http://emle.sourceforge.net/emle0200...le_lab_009.xml
http://emle.sourceforge.net/emle0200...le_lab_009.xml
and removed enough to get
it down
>Thank you for the reference
to <fieldsetwhich I did not know about.

It's a basic element in HTML 4.01 forms.
>Is the <fieldsetelement
some how needed or related to the issue of hiding the "0"?

Maybe. Would that matter?


>but I
would like to not have to create an name like "dummy" to tie the XSL
content to the CSS file.

Well, make it "huuhaa" then.
It is not the value of the name I am concerned about. It is the coupling
between the two that I would like to not increase if possible.
--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 2 '07 #6

P: n/a
The previous post was sent in error. I will just continue here.

C.W.Holeman II wrote:
Jukka K. Korpela wrote:
>That's one of your problems. You threw just a fragment of your problem
at us, and one that isn't even a real extract from the real page.

Actually I took the most complete page I had which is close to these:
The links should have been:

http://emle.sourceforge.net/emle0200...le_lab_009.xml
http://emle.sourceforge.net/emle0200...le_lab_009.xsd
http://emle.sourceforge.net/emle0200...le_lab_009.xsl
http://emle.sourceforge.net/emle0200...mle_lab_009.js
http://emle.sourceforge.net/emle0200...le_lab_009.css
>>Thank you for the reference
to <fieldsetwhich I did not know about.

It's a basic element in HTML 4.01 forms.
Which explains why I did not have that knowledge. I have been using
several HTML 3.2 books.
>>Is the <fieldsetelement
some how needed or related to the issue of hiding the "0"?

Maybe. Would that matter?
If it can bee ignored while addressing the posted question then the
other issues can be added to my existing list of topics to learn about.

Thank you for your help so far.

--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 2 '07 #7

P: n/a
scripts.contact wrote:
On May 1, 11:42 am, "C.W.Holeman II" <cwhii_google_s...@yahoo.com>
wrote:
>I what to hide an input element and the following text. I have the
selector for the input working and just need to grab the text following
it.

<input type="radio" name="numerator" value="0" checked="checked"/
><span>0</span>

form>input[value="0"][name="denominator"],form>input[value="0"]
[name="denominator"]+span{
visibility:hidden;
}
That seems better than my attempt at using span. I had the span with a
class name around the input and the text.

http://emle.sourceforge.net/emle020000/testf2.xml
http://emle.sourceforge.net/emle020000/testf2.xsl
http://emle.sourceforge.net/emle020000/testf2.css
<input type="radio" name="numerator" value="0" checked="checked"/>

form>input:after {content:attr(value) }
form>input[value="0"][name="denominator"],form>input[value="0"]
[name="denominator"]:after{
visibility:hidden;content:""
}
I will now look at these comments.

--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 2 '07 #8

P: n/a
Scripsit C.W.Holeman II:
I was displaying the "0" in order to have
vertical alignment of the buttons.
That was a wrong move - adding an _input element_ just to have some
_alignment_. You would guarantee the existence of a misleading input field
whenever CSS is off.
>A: Topics for this news group include:

* How to achieve a particular effect with style sheets
You're supposed to read that in the context of authoring for the World Wide
Web.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

May 3 '07 #9

P: n/a
Jukka K. Korpela wrote:
Scripsit C.W.Holeman II:
>I was displaying the "0" in order to have
vertical alignment of the buttons.

That was a wrong move - adding an _input element_ just to have some
_alignment_. You would guarantee the existence of a misleading input
field whenever CSS is off.
OK. Bad idea.
>>A: Topics for this news group include:

* How to achieve a particular effect with style sheets

You're supposed to read that in the context of authoring for the World
Wide Web.
Is there a better group to post to? Or do you have a suggestion for
warning purists like including "WnW3: " for Web not WWW in the subject.
Only a little :-)

--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 3 '07 #10

P: n/a
Jukka K. Korpela wrote:
Scripsit C.W.Holeman II:
>I was displaying the "0" in order to have
vertical alignment of the buttons.

That was a wrong move - adding an _input element_ just to have some
_alignment_. You would guarantee the existence of a misleading input
field whenever CSS is off.
OK. Is there a way to glue each of the items in the bottom row to the
corresponding one in the top row to keep them aligned vertically while
keeping the <hr/between them.

Example 1 has 0,1,2 as numerator values and just 1 and 2 for the
denominator.

Example-1a:

o 0 o 1 o 2
-------------
o 1 o 2

Example-1b:

o 0 o 1 o 2
-------------
o 1 o 2

Currently I am getting something like Example-1a. I found lack of
vertical alignment made it more difficult to make a selection.
Example-1b is what I would like to have.

Simply having the content aligned to the right would not work for a case
like Example 2. Example-2 has just 1 and 2 for numerator and 1,2,3 for
denominator.

Example-2a:

o 1 o 2
-------------
o 1 o 2 o 3
There is also the possibility of something like Example 3. Example 3 has
0,1,2,3,4 for numerator and only 1,2,4 for denominator.

Example-3a:

o 0 o 1 o 2 o 3 o 4
-----------------------
o 1 o 2 o 4

Example-3b:

o 0 o 1 o 2 o 3 o 4
-----------------------
o 1 o 2 o 4

Example-1a and Example-2a are here:

http://emle.sourceforge.net/emle020000/testh1.xml
http://emle.sourceforge.net/emle020000/testh1.xsl
http://emle.sourceforge.net/emle020000/testh1.css

My XSL file does not support a case like Example 3 yet.

To see more in context tests where these radio buttons actually
control something see the following links. There are differences
in that the testh1 files have added label and fieldset tags while
the ng20070426_emle_lab_009 files have the CSS hiding the "0"
denominator.

http://emle.sourceforge.net/emle0200...le_lab_009.xml
http://emle.sourceforge.net/emle0200...le_lab_009.xsl
http://emle.sourceforge.net/emle0200...mle_lab_009.js
http://emle.sourceforge.net/emle0200...le_lab_009.css

http://emle.sourceforge.net/index.shtml

--
C.W.Holeman II | cw***@Julian5Locals.com-5 http://JulianLocals.com/cwhii
To only a fraction of the human race does God give the privilege of
earning one's bread doing what one would have gladly pursued free, for
passion. I am very thankful. The Mythical Man-Month Epilogue/F.P.Brooks
May 3 '07 #11

P: n/a
Scripsit C.W.Holeman II:
To see more in context tests where these radio buttons actually
control something see the following links.
I think the context, purpose, and idea of your constructs has been rather
unclear, and the example...
http://emle.sourceforge.net/emle0200...le_lab_009.xml
.... doesn't enlighten me much, since I see a blank (all white) canvas. Using
another browser then gives some insight

If you are restricting the audience to the minority (of about 10 to 20 %)
users who do not use Internet Explorer, I think you should have said that
loud and clear. It puts things into perspective, and if you really make such
an exclusion, the CSS part becomes easier as well.

I don't think <hris what you need in the first place. The contexts of
radio buttons and their labels seems to be a presentation of a fractional
expression. Logically, <hrmeans "change of topic", not "division". In
presentation, <hris much of a problem in styling, with nasty browser
differences.

What I would use is a two-row table, with the division line styled using a
bottom border, and with each button/label pair in a cell of its own, and
probably so that when a button/label pair does not appear, it is not visible
at all, rather than having just the radio button greyed out.

Then vertical alignment, though not quite trivial, would be a rather
manageable issue.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

May 4 '07 #12

This discussion thread is closed

Replies have been disabled for this discussion.