Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Sep 2004
    Posts
    96
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Hiding text that's not in a tag

    I have a problem... I have text in a div class "schedule" which is dragged in dynamically. Basically all the headers are in span tags with the style "font-weight:bold" on them. I want to hide all the non-bold text, ie all the text in the div class .schedule that doesn't have a <span> tag around it. Any ideas?

  • #2
    Regular Coder
    Join Date
    Nov 2006
    Posts
    247
    Thanks
    13
    Thanked 26 Times in 24 Posts
    You need the non-bold text in a separate tag (other than <span>), such as <p>. So if you can, wrap all the non-bold text in <p> tags and use this CSS to hide it:

    Code:
    .schedule p {
        display:none;
    }
    Code:
    <div class="schedule">
    <span>Header</span>
    <p>hidden text. hidden text. hidden text. hidden text. hidden text. hidden text. hidden text. hidden text.</p>
    </div>
    Last edited by Majoracle; 01-17-2008 at 09:36 AM.

  • #3
    New Coder
    Join Date
    Sep 2004
    Posts
    96
    Thanks
    1
    Thanked 0 Times in 0 Posts
    its not possible to change it to this way... ie. it would be:

    Code:
    <div class="schedule"><span style="font-weight: bold; color: ff0000;">Monday</span><br />Line 2<br /><span style="font-weight: bold; color: ff0000;">Monday</span><br />Line 4</div>
    So you can see I need to show only the text in the <span> tags

  • #4
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    Probably not possible... and certainly not semantic. How about trying something like (and this won't work, but meh):

    Code:
    .shedule {
    	display: none;
    }
    
    .schedule span {
    	display: inline; /* (or block) */
    }
    But I don't think that would work because you aren't displaying the outer div so you can't see the contents inside.
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,695
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    You could only do it with JavaScript, I guess, as any text is a node and CSS can only address element nodes while JS can also address plain text nodes.

  • #6
    Regular Coder medigerati's Avatar
    Join Date
    Jul 2005
    Location
    San Antonio, Tx
    Posts
    163
    Thanks
    0
    Thanked 7 Times in 7 Posts
    You can also try this:

    Code:
    .shedule {
    	position: relative;
    	left: -999em;
    }
    
    .schedule span {
    	position: relative;
    	left: 999em;
    }
    or this:

    Code:
    .shedule {
    	margin-left: -999em;
    }
    
    .schedule span {
    	margin-left: 999em;
    }
    At least, I think one of those should work.
    If you need a little more help, I'm available as a Website designer in San Antonio
    ----------
    If I've helped, please check out my friend's nature photography and let me know if you like anything.

  • #7
    Regular Coder
    Join Date
    Nov 2006
    Posts
    247
    Thanks
    13
    Thanked 26 Times in 24 Posts
    That seems messy. You'd still have the gaps between the spans, so people would know something is there.

    Code:
    .shedule {
    	display: none;
    }
    .schedule span {
    	display: inline; /* (or block) */
    }
    That wont work either. It'll still show nothing for stuff in <span> tags. So unless you can place the text you don't want to show in some tags of its own, I think it's impossible.

  • #8
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,706
    Thanks
    0
    Thanked 236 Times in 231 Posts
    Hi there denhamd2,

    have a look at this example, it may suit your requirements...
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <style type="text/css">
    .schedule {
        visibility:hidden;
     }
    .schedule h4 {
        visibility:visible;
        color:#f00;
    }
    </style>
    
    </head>
    <body>
    
    <div class="schedule">
    <h4>Monday</h4>
    Line 2
    <h4>Monday</h4>
    Line 4
    </div>
    
    </body>
    </html>
    coothead


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •