so when i put an image into a node teaser, and there is another teaser on the same page, the next node teaser text flows into the previous text. i have to manually enter several line breaks so that the text is 'larger' and the next image doesn't flow into it. that is to say, instead of each teaser being treated as a distinct div, with the bottom of the image delineating its own region, the text from the next teaser will flow up into the previous one if the text is smaller than the image. this is using the node_teaser module and a theme based on boxed_grey any ideas? e.g. if you look here: http://freedom-center.org/section/activism%2Badvocacy the 'read more' should be much lower, alongside the bottom of the image. instead, the next text starts alongside, not below, the image, in the previous teaser's space. thanks! -- will
Quoting will hall <will@theicarusproject.net>:
any ideas?
e.g. if you look here: http://freedom-center.org/section/activism%2Badvocacy
the 'read more' should be much lower, alongside the bottom of the image. instead, the next text starts alongside, not below, the image, in the previous teaser's space.
I suggest a <!--break--> teaser tag in the "Freedom Center Legal Education Guide" post. That is <!--break> in case your mail client doesn't like the symbols themselves. I forget if V5 left in the change for this tag; there was some release that had changed it to <break> (<break>) instead. Earnie
hi, thanks for replying. i just tried that <!--break--> idea and it unfortunately doesn't help. i am using the node_teaser module so that there is an extra text field, esp for teasers, in the node edit page. it seems to be something about how the node creation generates css for the image? Earnie Boyd wrote:
Quoting will hall <will@theicarusproject.net>:
any ideas?
e.g. if you look here: http://freedom-center.org/section/activism%2Badvocacy
the 'read more' should be much lower, alongside the bottom of the image. instead, the next text starts alongside, not below, the image, in the previous teaser's space.
I suggest a <!--break--> teaser tag in the "Freedom Center Legal Education Guide" post. That is <!--break> in case your mail client doesn't like the symbols themselves. I forget if V5 left in the change for this tag; there was some release that had changed it to <break> (<break>) instead.
Earnie
I was looking at it this morning, but haven't found time to actually work with the code, so I cannot do more at this instant than point you in the direction of a possible solution. I noticed that the problematic post is "sticky"; as a result it is wrapped in a div of class "node sticky" (or similar). You could place a clear statement in your style.css for that class. However, the problem is caused also, because you have a huge photo and very little text. If this post is meant as a sticky intro post, perhaps you might consider either cropping or resizing the picture to go with the amount of text shown in the teaser (or is it the full text?). If the text is all there is, that explains why the "break" solution doesn't work. saludos, Victor Kane http://awebfactory.com.ar On 3/16/07, will hall <will@theicarusproject.net> wrote:
hi, thanks for replying.
i just tried that <!--break--> idea and it unfortunately doesn't help. i am using the node_teaser module so that there is an extra text field, esp for teasers, in the node edit page.
it seems to be something about how the node creation generates css for the image?
Earnie Boyd wrote:
Quoting will hall <will@theicarusproject.net>:
any ideas?
e.g. if you look here: http://freedom-center.org/section/activism%2Badvocacy
the 'read more' should be much lower, alongside the bottom of the image. instead, the next text starts alongside, not below, the image, in the previous teaser's space.
I suggest a <!--break--> teaser tag in the "Freedom Center Legal Education Guide" post. That is <!--break> in case your mail client doesn't like the symbols themselves. I forget if V5 left in the change for this tag; there was some release that had changed it to <break> (<break>) instead.
Earnie -- [ Drupal support list | http://lists.drupal.org/ ]
that is to say, instead of each teaser being treated as a distinct div, with the bottom of the image delineating its own region, the text from the next teaser will flow up into the previous one if the text is smaller than the image.
The img align="right" makes the image float. All of the following elements will flow around it. You can use the css clear property (http://www.w3schools.com/css/pr_class_clear.asp) in one of the following blocks so that it has "clear" margins to fix this. Playing around in firebug, the following css would create the layout I think you want: .main-content .node .links { clear:both; }. The selector is on line 357 of style.css. and is tied in with .main-content .node .terms. I'm pretty sure can simply add the text about into the style sheet, but you may have to split the two selectors apart.
participants (4)
-
Dale McGladdery -
Earnie Boyd -
Victor Kane -
will hall