Community Forums › Forums › Archived Forums › Design Tips and Tricks › Author Pro Plugin archive page float problem
Tagged: Clear floats in Author Pro
- This topic has 7 replies, 2 voices, and was last updated 6 years, 9 months ago by Bug.
-
AuthorPosts
-
June 15, 2017 at 9:15 am #207794BugMember
I am trying to get the fourth book on this archive page to float up so it's on the same line as the first three. I have tried this CSS (and many others) and it's not working.
.archive.genesis-author-pro .content .entry:nth-of-type(3n+1) {
clear: both;
margin-left: 0;
}I have tried shrinking the elements way down in size and it still won't float up, so it's not a size issue.
http://business.bristleconestudio.com/book-tag/novels/June 15, 2017 at 10:57 am #207802Victor FontModeratorAt line 1643 in style.css, 3n+1 to 4n+1. This works in the inspector.
.archive.genesis-author-pro .content .entry:nth-of-type(4n+1)
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?June 15, 2017 at 11:04 am #207803BugMemberHi Victor,
I fixed it myself by switching it to clear: none. I don't really understand why it worked.
June 15, 2017 at 11:33 am #207805Victor FontModeratorI'll explain why it worked. The clear basically acts as a line break for the float: left that positions the articles. This allows subsequent lines of content to display correctly. By turning this off, you are essentially telling all articles to line up to the left of each other in perpetuity. This may cause you other problems on screens of different widths or resolutions. You can end up with 5, 6, or more items on a line.
The 3n+1 in the CSS directive, says clear the float after every third article and start the next line. If you want to display 4 items on a line, the fix is changing 3n+1 to 4n+1, not clearing all floats.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?June 15, 2017 at 12:17 pm #207808BugMemberWell I think part of my problem is this: In the Inspector, if you click on the 4th book, in the CSS pane it looks like this (the strike-throughs and checkboxes aren't showing up right here):
.archive.genesis-author-pro .content .entry:nth-of-type(3n+1) {
clear: none;
margin-left: 2%;
}
.archive.genesis-author-pro .content .entry:nth-of-type(3n+1) {
clear: both;
margin-left: 0;But that CSS is in there twice. I haven't added it anywhere except in Customizing>additional css so I don't know where the lower one is located. I looked in style.css and it's not there. Do you know where else that CSS line could be hiding?
June 15, 2017 at 1:05 pm #207814Victor FontModeratorThat's because it's the 4th book and 3n+1 only applies to the third book.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?June 15, 2017 at 1:48 pm #207818BugMemberI did go into the plugin's CSS file (default.css) through the C-panel and changed it like you said. I saw how it changed in the Inspector, and you are correct that it worked. But even though I changed it in the default.CSS it still says the same thing in the Inspector. I don't understand how to change plugin CSS I guess, or why the change I made to default.css isn't showing up.
June 15, 2017 at 1:57 pm #207820BugMemberOMG it worked, once I cleared the cache. Thank you SOOOOOO much!
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.