SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Zealot akohl's Avatar
    Join Date
    Jun 2001
    Location
    Israel
    Posts
    184
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    getting one paragraph to wrap and the next not.

    In the below example, I want some text to wrap to the left of a picture and
    some other text to go below the picture.

    I thought that placing "clear :none;" on the paragraph that is to
    go below the picture is supposed to do that.

    I know I should be able to solve the problem by
    putting a table inside the cell.
    But I'd much rather keep the html simpler and do it with css.


    I'm testing the site in ie5 and opera 6 and it doesn't work in either.


    Code:
    .righty 
    {  
    	float: right; 
    	border: thin #000000 none; 
    	margin-top: 2px; margin-right: 2px; margin-bottom: 2px; margin-left: 2px; 
    	padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px
    }
    
    .marginText 
    {  
    	font-family: "Bookman Old Style", "Book Antiqua"; 
    	color: #0000CC; font-size: 12px;
    	/*clear: all;  adding this here didn't help either*/
    }
    .marginTextBelow 
    {  
    	font-family: "Bookman Old Style", "Book Antiqua"; 
    	color: #0000CC; font-size: 10px;
    	/* this clear doesn't seem to have any effect*/
    	clear: none;
    }
    
    
    <td valign='top'>
    	<h2>
    		Title
    	</h2>
    	<p class='marginText'>
    		some text that should and does wrap to the 
    		left of the picture.
    	</p>
    	<div class='righty'>
    		<img src='images/picture.gif'>
    	</div>
    	<p class='marginTextBelow'>
    		some text that should be below the 
    		picture but instead wraps 
    		to the left
    	</p>
    
    </td>

  2. #2
    SitePoint Zealot matiefert's Avatar
    Join Date
    Nov 2001
    Location
    Bay area, California
    Posts
    188
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I suppose it's cheating (since it isn't CSS), but I just insert <br clear="right"> (or "left") on the page wherever it's needed.

    cheers,

    Marj

  3. #3
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just use the align="right" attribute in the IMG tag.

    <img src="blah.jpg" align="right" vspace="5" hspace="5">

    That will cause any text to wrap to the left of the image. To make sure the next paragraph of text is not affected, place a <br clear="all"> after the first paragraph.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  4. #4
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    "Clear: none" just tells the browser to wrap it. You want "clear: right" (other values are "left" and "both"). :-)

    ~~Hope This Helps

  5. #5
    Prolific Blogger silver trophy Technosailor's Avatar
    Join Date
    Jun 2001
    Location
    Before These Crowded Streets
    Posts
    9,446
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You might also consider the use of DIV's, which is technically the correct way to do layouts according to XHTML Strict and CSS2 standards....Creole will argue vehemently, or should I say dispute me vigorously (s9ince it takes 2 to argue ) that it's not well supported, and indeed he has a point. But I prefer to use DIV layers for positioning.

    HTH.

    Sketch

    PS...messing with you Creole!
    Aaron Brazell
    Technosailor



  6. #6
    SitePoint Zealot akohl's Avatar
    Join Date
    Jun 2001
    Location
    Israel
    Posts
    184
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    I guess I just got it backwards.

    Originally posted by Ian Glass
    "Clear: none" just tells the browser to wrap it. You want "clear: right" (other values are "left" and "both"). :-)

    ~~Hope This Helps
    That's it.
    I just got the terms switched around.
    Thanks for your help.

  7. #7
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Re: I guess I just got it backwards.

    Originally posted by akohl
    That's it.
    I just got the terms switched around.
    Thanks for your help.
    Always Glad to Help! :-)


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
  •