By twmiller on

I've been going through the O'Reilly's Using Drupal book and just finished chapter 4. So far I think the book has been pretty good, but they've unfortunately finally made the (sadly common) mistake of dropping a little bit of code and not explaining it in great enough detail.

The chapter uses CSS_injector to reformat how a product review site (built using cck, views, and the amazon module) displays the information in the review. The code works; I'm just not exactly sure what they're modifying or how a layman is supposed to find information about the div elements being modified. CSS injector is used to inject the following to all pages:

div.fieldgroup { 
  border: 1px solid lightgrey;
  float: right;
  padding: 10px 2px;
  width: 200px;
  font-size: .9em;
  }

div.field-label-inline-first {
  float: left;
}

They never fully explain what fieldgroup and field-label-inline-first actually are. Are these modifying existing div elements that CCK has created?

Thanks in advance for the help.

⋅ Categories: Drupal 6.x

Comments

Source Perrier’s picture

Source Perrier commented

Hello,

I'm having the same problem as you. I did everything in Chapter 4, but in the end the review panel (div.fieldgroup) appeared above the Amazon information. I've been scratching my head to figure out what I did wrong/how I can fix this.

Did you ever find any good info?

Thanks,
Adam

Source Perrier’s picture

Source Perrier commented

I found a solution to this problem if anyone is interested.

In the Amazon module's folder, I found amazon.css, which has the CSS code for all of the

classes used by the Amazon Information field.

The

class field-type-asin defines the layout for the Amazon Information field, so I added the following code to the CSS_Injector in question:

div.field-type-asin {
clear: none;
}

This kept the Review field from stacking on top of the Amazon Information field, and allowed it to float to its right.