clear:both problem, I think

[laomeng]

First, thanks in advance for the help. I've got PhocaGallery 2.6.0. I'm trying to view the pictures in a category. The view of all the categories on a page is fine. But when I click into a particular category there is a big space between between category title (or the back to categories button if that is enabled) and the start of the actual pictures. My overall page has a column on the left side of the screen that is float:left. The pictures start under there that column ends. So I think I'm getting float creep. I see in the generated source for the page that after each picture PhocaGallery adds a clear:both. So I suspect that the first of those clears is actually clearing my float for the left column. I grepped through the component code but there are so many places that clear:both is used and I'm not sure which is in play here. I also tried adding a cheat in my own file to add a float:left to be cleared, but that didn't work. Here is a screenshot of the page: . And below are all of my current PhocaGallery settings:
categories_columns=3
equal_percentage_width=1
display_image_categories=1
image_categories_size=4
categories_image_ordering=9
categories_display_avatar=0
display_subcategories=1
display_empty_categories=0
hide_categories=
display_access_category=0
default_pagination_categories=20
pagination_categories=5;10;15;20;50
font_color=#b36b00
background_color=none
background_color_hover=none
image_background_color=none
image_background_shadow=shadow1
border_color=#e8e8e8
border_color_hover=#b36b00
margin_box=5
padding_box=5
display_name=1
display_icon_detail=1
display_icon_download=2
display_icon_folder=1
font_size_name=12
char_length_name=15
category_box_space=50
display_categories_sub=1
display_subcat_page=1
display_category_icon_image=1
category_image_ordering=9
display_back_button=0
display_categories_back_button=0
default_pagination_category=20
pagination_category=5;10;15;20;50
display_img_desc_box=0
font_size_img_desc=10
img_desc_box_height=30
char_length_img_desc=300
display_categories_cv=1
display_subcat_page_cv=1
display_category_icon_image_cv=1
category_image_ordering_cv=9
display_back_button_cv=0
display_categories_back_button_cv=0
categories_columns_cv=3
display_image_categories_cv=1
image_categories_size_cv=4
detail_window=0
detail_window_background_color=#ffffff
modal_box_overlay_color=#000000
modal_box_overlay_opacity=0.3
modal_box_border_color=#6b6b6b
modal_box_border_width=2
sb_slideshow_delay=5
sb_lang=en
highslide_class=rounded-white
highslide_opacity=0
highslide_outline_type=rounded-white
highslide_fullimg=0
highslide_close_button=0
highslide_slideshow=1
jak_slideshow_delay=5
jak_orientation=horizontal
jak_description=1
jak_description_height=10
display_description_detail=0
display_title_description=0
font_size_desc=11
font_color_desc=#333333
description_detail_height=16
description_lightbox_font_size=12
description_lightbox_font_color=#ffffff
description_lightbox_bg_color=#000000
slideshow_delay=3000
slideshow_pause=0
slideshow_random=0
detail_buttons=1
phocagallery_width=
phocagallery_center=3
display_phoca_info=6
category_ordering=1
image_ordering=1
enable_user_cp=0
enable_upload_avatar=1
enable_avatar_approve=0
enable_usercat_approve=0
enable_usersubcat_approve=0
user_subcat_count=5
max_create_cat_char=1000
enable_userimage_approve=0
max_upload_char=1000
upload_maxsize=3145728
upload_maxres_width=3072
upload_maxres_height=2304
user_images_max_size=20971520
enable_java=0
enable_java_admin=1
java_resize_width=-1
java_resize_height=-1
java_box_width=480
java_box_height=480
display_rating=0
display_rating_img=0
display_comment=0
display_comment_img=0
comment_width=500
max_comment_char=1000
external_comment_system=0
enable_piclens=0
start_piclens=0
piclens_image=1
switch_image=0
switch_width=640
switch_height=480
enable_overlib=0
ol_bg_color=#666666
ol_fg_color=#f6f6f6
ol_tf_color=#000000
ol_cf_color=#ffffff
overlib_overlay_opacity=0.7
create_watermark=0
watermark_position_x=center
watermark_position_y=middle
display_icon_vm=0
display_category_statistics=0
display_main_cat_stat=1
display_lastadded_cat_stat=1
count_lastadded_cat_stat=3
display_mostviewed_cat_stat=1
count_mostviewed_cat_stat=3
display_camera_info=0
exif_information=FILE.FileName;FILE.FileDateTime;FILE.FileSize;FILE.MimeType;COMPUTED.Height;COMPUTED.Width;COMPUTED.IsColor;COMPUTED.ApertureFNumber;IFD0.Make;IFD0.Model;IFD0.Orientation;IFD0.XResolution;IFD0.YResolution;IFD0.ResolutionUnit;IFD0.Software;IFD0.DateTime;IFD0.Exif_IFD_Pointer;IFD0.GPS_IFD_Pointer;EXIF.ExposureTime;EXIF.FNumber;EXIF.ExposureProgram;EXIF.ISOSpeedRatings;EXIF.ExifVersion;EXIF.DateTimeOriginal;EXIF.DateTimeDigitized;EXIF.ShutterSpeedValue;EXIF.ApertureValue;EXIF.ExposureBiasValue;EXIF.MaxApertureValue;EXIF.MeteringMode;EXIF.LightSource;EXIF.Flash;EXIF.FocalLength;EXIF.SubSecTimeOriginal;EXIF.SubSecTimeDigitized;EXIF.ColorSpace;EXIF.ExifImageWidth;EXIF.ExifImageLength;EXIF.SensingMethod;EXIF.CustomRendered;EXIF.ExposureMode;EXIF.WhiteBalance;EXIF.DigitalZoomRatio;EXIF.FocalLengthIn35mmFilm;EXIF.SceneCaptureType;EXIF.GainControl;EXIF.Contrast;EXIF.Saturation;EXIF.Sharpness;EXIF.SubjectDistanceRange;GPS.GPSLatitudeRef;GPS.GPSLatitude;GPS.GPSLongitudeRef;GPS.GPSLongitude;GPS.GPSAltitudeRef;GPS.GPSAltitude;GPS.GPSTimeStamp;GPS.GPSStatus;GPS.GPSMapDatum;GPS.GPSDateStamp
google_maps_api_key=
display_categories_geotagging=0
categories_lng=
categories_lat=
categories_zoom=2
categories_map_width=
categories_map_height=500
display_icon_geotagging=0
display_category_geotagging=0
category_map_width=500
category_map_height=400
pagination_thumbnail_creation=0
clean_thumbnails=0
enable_thumb_creation=1
crop_thumbnail=5
jpeg_quality=85
enable_picasa_loading=1
picasa_load_pagination=20
icon_format=gif
large_image_width=640
large_image_height=480
medium_image_width=100
medium_image_height=100
small_image_width=50
small_image_height=50
front_modal_box_width=680
front_modal_box_height=560
admin_modal_box_width=680
admin_modal_box_height=520
folder_permissions=0755
jfile_thumbs=1

[Ronny]

Hi,

did you already check if this error persist when using one of the standard templates (e.g. rhuk_milkyway)? If it doesn't the reason lies within the template you're using.

Regards,
Ronny

[laomeng]

It doesn't occur in rhuk*. I've now made it not occur in my template either by adding a floated wrapper around the main content area that houses the gallery (I see that is what rhuk* and beez both do as well). I'm new to joomla so don't know all of the rules for modules. But it seems to me that a component/module should stand on it's own and not be dependent on the external template to provide a floated div that isn't necessary. Shouldn't a module only clear it's own floats? Please don't misunderstand me, I am not saying that I think phocagallery is not good, it's a complicated component/module/plugin combination, I very much appreciate it and will gladly display the white seal! I am just trying to understand more about joomla and it's add-ons as well as trying to be a contributing member of the community by bringing up issues (and hopefully solutions when I become a more adept user) that I run into. Thanks for the good work on Phoca products Jan!

[Ronny]

Great that you've solved your issue!

Well, I'm not really sure about the relation between templates and modules in Joomla - never programmed any of those. But I think both have to go conform with certain rules, and modules have to rely on the templates, and vice versa. So - don't know whom to blame here; to my experience it has mostly been due the template when such issues occured. As rhuk_milkyway is a standard template delivered with Joomla I assume it is developed according the Joomla design rules - and if a certain element is in that template it should be in any other self-developed template, too.

Just my 2 cents...


Regards,
Ronny

[laomeng]

Sounds like a good rule to follow Ronny. Thanks for your help! All the best to you!

[Ronny]

You're welcome!

Regards,
Ronny