This is the community forum. For a developer response use the Client Area.
Follow us on Facebook, Twitter and YouTube!

Float collisions with left vertical nav bar
#1

In addition to a fairly standard horizontal menu across the top, my site has a vertical navigation bar running down the left side. It's positioned there with a "float:left" css rule, and it's fairly tall, and it's going to get taller as I publish more books. That means that the "clear:both" and "clear:left" rules in
\comments\includes\template\comments.php
and
\comments\includes\template\form.php
position everything that follows below the lowest edge of my vertical navigation bar, sometimes leaving a big gap between the page content and the comments, as you can see in this example:

http://www.jldoty.com/com_test/test1.php

To fix that I made a number of modifications to comments.php, form.php and stylesheet.css, eliminating a lot of the floats (many of them were unnecessary) and all of the "clear:both" and "clear:left" rules. The result can be seen here:

http://www.jldoty.com/com_test/test2.php

Attached are the modified files. You can see each modification, and an explanation about it, in the two php files by searching on "JLD mod".

Commentics is great stuff and I'm going to use it, and after I've had a little more experience with it I'm probably going to donate to help support the effort. The Commentics team has done a great job, but in doing this I noticed that the HTML coding does not adhere to best practices as defined by W3C. Specifically:

1. Excessive use of <div> tags for formatting
2. Content placed directly in a <div> and not in a proper block element
3. Use of inline styles.

Regarding 1 and 2, there should only be a few key <div> tags, while all content should be placed in appropriate block-level elements (like <p>) within the <div> tags, with classes assigned to the block-level tags. Regarding 3, that's a big no-no. Styling should be applied using css rules in style sheets, and had it been done so, the only thing I would have had to modify would have been the style sheet.

Again, this is meant as constructive criticism for a very nice product. My compliments to the Commentics team!


Attached Files
.zip FloatFixFiles.zip Size: 14.25 KB  Downloads: 25
Reply
#2

I just discovered that I had to make similar modifications to:

comments\includes\app\processor.php

to accomodate the success, preview, approval and error boxes.

Updated files attached.


Attached Files
.zip FloatFixFiles2.zip Size: 19.77 KB  Downloads: 25
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)