SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    text-align: justify

    I'm experimenting with using "text-justify: newspaper" on a page which uses a table to split the contents into columns, but it only appears to work on the first column... Here's CSS file thingy:

    Code:
    body {
     background:			black;
     overflow:                      auto;
    }
    
    body, td {
     color:                         555555;
     font-family:                   verdana;
     font-size:                     8pt;
     font-weight:                   bold;
     text-decoration:               none;
     text-align:			justify;
     text-justify:			newspaper;
     width:                         125;
     cursor:                        default;
     scrollbar-3dlight-color:       808080;
     scrollbar-highlight-color:     black;
     scrollbar-face-color:          black;
     scrollbar-shadow-color:        black;
     scrollbar-darkshadow-color:    808080;
     scrollbar-track-color:         black;
     scrollbar-arrow-color:         666666;
    }
    
    br {
     font-size:                     5pt;
    }
    
    a, span, .unhover {
     color:                         666666;
     text-decoration:               none;
     cursor:                        default;
    }
    
    a:hover, .hover {
     color:                         aaaaaa;
     text-decoration:               none;
     cursor:                        default;
    }
    
    input, select, textarea {
     background:                    black;
     color:                         aaaaaa;
     border-color:                  666666;
     font-family:                   verdana;
     font-size:                     8pt;
     font-weight:                   bold;
     overflow:                      auto;
     scrollbar-3dlight-color:       808080;
     scrollbar-highlight-color:     black;
     scrollbar-face-color:          black;
     scrollbar-shadow-color:        black;
     scrollbar-darkshadow-color:    808080;
     scrollbar-track-color:         black;
     scrollbar-arrow-color:         666666;
    }
    
    div.topleft {
     position:                      absolute;
     top:                           5pt;
     left:                          6pt;
     height:			98%;
     width:				100%;
     z-index:			1;
    }
    
    div.backing {
     position:			absolute;
     top:				0;
     left:				0;
     height:			98%;
     width:				100%;
     z-index:			0
    }
    
    img.show {
     visibility:			visible;
    }
    
    img.hide {
     visibility:			hidden;
    }
    Please feel free to look at the source code of the site if that'll help... I won't present it here, as it's probably far too lengthy.

    I appreciate that the effect might not be best suited to a site like the one I'm trying it on, but really I'm just interested as to why it doesn't work. Anyway, any assistance will be much appreciated.

  2. #2
    SitePoint Wizard westmich's Avatar
    Join Date
    Mar 2000
    Location
    Muskegon, MI
    Posts
    2,328
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It seems like you have something tied to the mouseover event. When I expanded the window on my machine (Windows 2000; IE 6) all the columns were justified. As I moused over each column, the text became left aligned.
    Westmich
    Smart Web Solutions for Smart Clients
    http://www.mindscapecreative.com

  3. #3
    SitePoint Member
    Join Date
    Sep 2002
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Now that is bizarre... They appear to justify when I maximise or restore the window, but align to the left when I mouseover them... But it's a little inconsistent, because sometimes they don't all justify... Could that be a problem in IE6's code? I'm running IE6 in Windows 98, by the way... The events I have on the mouseover and mouseout events for the linky thingies are to change the class of the linky thing (it's actually a span), and to run a short JavaScript function which changes the class of a div element thing... I dunno, it just seems very strange that the first td should work all the time, but not the others.

    I can't really think of anything else to add now. Thanks anyway.


Bookmarks

Posting Permissions

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