Skip navigation
Erik Arckens
Erik Arckens Calculating status...
Currently Being Moderated

how to float an image left of a underlined header?

May 2, 2009 6:12 AM

..well that is the question.

 

Here is an example of how I would like the result to be (look halfway down the page): http://www.ecstechnics.com/modules/page.phtml?dimensionid=18&pageid=24

 

I can make a simple header that sits to the right of a left floated picture, but as soon as I make a class with a simple line drawn underneath in it and attach that to the header, the line goes straight thru the picture.

I attached the main css file as text file.

 

The style applies to the container called "inhoud"; the classes used to draw line are .wide (full container width) and .short (400px wide). It is this last one that I need to work with a floating picture.

 

Thanks for any suggestions

Erik

 

ps: the same question was posted here http://forums.adobe.com/thread/427454?tstart=0 and here http://forums.adobe.com/thread/427154?tstart=0, but without the main.css rules attached as text file.

Attachments:
393 Views   3 Replies   Latest reply: Erik Arckens, May 2, 2009 9:07 PM
 
Replies
  • Nancy O.
    Currently Being Moderated
    1. Nancy O.,
    May 2, 2009 12:19 PM   in reply to Erik Arckens
    Report

    Your example page is built with tables.  Images are in <td>.  Descriptions are in adjacent <td>.

     

    ECSTable.gif

     

    CSS floats do not behave the same as table columns.  You should place your headings above the float.

    See my example here (view page source to see the CSS and HTML code).

    http://alt-web.com/DEMOS/floatRight.html

     

    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics |  Print | Media Specialists
    www.alt-web.com/

     
    |
    Mark as:
  • Mark A. Boyd
    Currently Being Moderated
    2. Mark A. Boyd,
    May 2, 2009 6:49 PM   in reply to Erik Arckens
    Report

    ps: the same question was posted here http://forums.adobe.com/thread/427454?tstart=0 and here http://forums.adobe.com/thread/427154?tstart=0, but without the main.css rules attached as text file.

     

    Why are you asking the same question in multiple threads?!

     

    See my reply in Re: CSS style rule question: positioning of block level next to image where I said:

    See my reply #8 in your other thread Re: css style rule question

     

    Although you may want a .shortRight and a .shortLeft, now.

     


    --
    Mark "Daisy Chain" Boyd
    Keep-On-Learnin' :-)

     
    |
    Mark as:
  • Erik Arckens
    Currently Being Moderated
    3. Erik Arckens,
    May 2, 2009 9:07 PM   in reply to Mark A. Boyd
    Report

    To Nancy:

    I find your answer very helpful. I hope this sample page stays up a while, I will copy it today or tomorrow. But would there be no solution to floating of a header to the right of an image? Your example puts the header on top, I would love to see the header next to (at the right of) the image.

     

    To Mark:

    my apologies for the confusion I created; I saw no reply at first to my initial post and thought that I did not word it clear enough, and so I posted it again, and added the css attachment. But I see my mistake, I know better now. Thank you all for your help; next time I will stick to my original post.

     

    Erik

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points