From f6d61112af82882212f0b853794a059c6570a8c1 Mon Sep 17 00:00:00 2001 From: "Rob G. Healey" Date: Thu, 15 Dec 2011 04:37:51 +0000 Subject: [PATCH] Completed stylesheet cleanup. svn: r18601 --- src/plugins/webreport/NarrativeWeb.py | 320 +++++++----------- src/plugins/webstuff/css/Web_Basic-Blue.css | 146 ++------ .../webstuff/css/Web_Horizontal-Menus.css | 83 +---- 3 files changed, 165 insertions(+), 384 deletions(-) diff --git a/src/plugins/webreport/NarrativeWeb.py b/src/plugins/webreport/NarrativeWeb.py index 4b44880da..94cc35581 100644 --- a/src/plugins/webreport/NarrativeWeb.py +++ b/src/plugins/webreport/NarrativeWeb.py @@ -503,6 +503,94 @@ class BasePage(object): self.inc_families = report.options['inc_families'] self.inc_events = report.options['inc_events'] + def display_relationships(self, individual, ppl_handle_list, place_lat_long): + """ + Displays a person's relationships ... + + @param: family_handle_list -- families in this report database + @param: ppl_handle_list -- people in this report database + @param: place_lat_long -- for use in Family Map Pages + """ + db = self.report.database + birthorder = self.report.options["birthorder"] + + family_list = individual.get_family_handle_list() + if not family_list: + return None + + with Html("div", class_ ="subsection", id ="families") as section: + section += Html("h4", _("Families"), inline =True) + + table_class = "infolist" + if len(family_list) > 1: + table_class += " fixed_subtables" + with Html("table", class_ = table_class) as table: + section += table + + for fhandle in family_list: + family = db.get_family_from_handle(fhandle) + if family: + self.display_spouse(family, table, ppl_handle_list, place_lat_long) + + childlist = family.get_child_ref_list() + if childlist: + trow = Html("tr") + ( + Html("td", " ", class_ = "ColumnType", inline = True), + Html("td", _("Children"), class_ = "ColumnAttribute", inline = True) + ) + table += trow + + tcell = Html("td", class_ = "ColumnValue") + trow += tcell + + ordered = Html("ol") + tcell += ordered + childlist = [child_ref.ref for child_ref in childlist] + + # add individual's children event places to family map... + if self.familymappages: + for handle in childlist: + child = db.get_person_from_handle(handle) + if child: + self._get_event_place(child, ppl_handle_list, place_lat_long) + + children = add_birthdate(db, childlist) + if birthorder: + children = sorted(children) + + ordered.extend( + self.display_child_link(chandle, ppl_handle_list) + for birth_date, chandle in children + ) + + # family LDS ordinance list + family_lds_ordinance_list = family.get_lds_ord_list() + if family_lds_ordinance_list: + trow = Html("tr") + ( + Html("td", " ", class_ = "ColumnType", inline = True), + Html("td", _("LDS Ordinance"), class_ = "ColumnAttribute", inline = True), + Html("td", self.dump_ordinance(db, family, "Family"), class_ = "ColumnValue") + ) + table += trow + + # Family Attribute list + family_attribute_list = family.get_attribute_list() + if family_attribute_list: + trow = Html("tr") + ( + Html("td", " ", class_ ="ColumnType", inline =True), + Html("td", _("Attributes"), class_ ="ColumnAttribute", inline =True) + ) + table += trow + + tcell = Html("td", class_ = "ColumnValue") + trow += tcell + + # we do not need the section variable for this instance of Attributes... + dummy, attrtable = self.display_attribute_header() + tcell += attrtable + self.display_attr_list(family_attribute_list, attrtable) + return section + def complete_people(self, tcell, first_person, handle_list, ppl_handle_list, up =True): """ completes the person column for classes EventListPage and EventPage @@ -2018,94 +2106,6 @@ class BasePage(object): """ return Html("a", _("Family Map"), href = url, title =_("Family Map"), class_ ="familymap", inline =True) - def display_relationships(self, ppl_handle_list, place_lat_long): - """ - Displays a person's relationships ... - - @param: family_handle_list -- families in this report database - @param: ppl_handle_list -- people in this report database - @param: place_lat_long -- for use in Family Map Pages - """ - db = self.report.database - birthorder = self.report.options["birthorder"] - - family_list = self.person.get_family_handle_list() - if not family_list: - return None - - with Html("div", id ="families", class_ ="subsection") as section: - section += Html("h4", _("Families"), inline =True) - - table_class = "infolist" - if len(family_list) > 1: - table_class += " fixed_subtables" - with Html("table", class_ = table_class) as table: - section += table - - for fhandle in family_list: - family = db.get_family_from_handle(fhandle) - if family: - self.display_spouse(family, table, ppl_handle_list, place_lat_long) - - childlist = family.get_child_ref_list() - if childlist: - trow = Html("tr") + ( - Html("td", " ", class_ = "ColumnType", inline = True), - Html("td", _("Children"), class_ = "ColumnAttribute", inline = True) - ) - table += trow - - tcell = Html("td", class_ = "ColumnValue") - trow += tcell - - ordered = Html("ol") - tcell += ordered - childlist = [child_ref.ref for child_ref in childlist] - - # add individual's children event places to family map... - if self.familymappages: - for handle in childlist: - child = db.get_person_from_handle(handle) - if child: - self._get_event_place(child, ppl_handle_list, place_lat_long) - - children = add_birthdate(db, childlist) - if birthorder: - children = sorted(children) - - ordered.extend( - self.display_child_link(chandle, ppl_handle_list) - for birth_date, chandle in children - ) - - # family LDS ordinance list - family_lds_ordinance_list = family.get_lds_ord_list() - if family_lds_ordinance_list: - trow = Html("tr") + ( - Html("td", " ", class_ = "ColumnType", inline = True), - Html("td", _("LDS Ordinance"), class_ = "ColumnAttribute", inline = True), - Html("td", self.dump_ordinance(db, family, "Family"), class_ = "ColumnValue") - ) - table += trow - - # Family Attribute list - family_attribute_list = family.get_attribute_list() - if family_attribute_list: - trow = Html("tr") + ( - Html("td", " ", class_ ="ColumnType", inline =True), - Html("td", _("Attributes"), class_ ="ColumnAttribute", inline =True) - ) - table += trow - - tcell = Html("td", class_ = "ColumnValue") - trow += tcell - - # we do not need the section variable for this instance of Attributes... - dummy, attrtable = self.display_attribute_header() - tcell += attrtable - self.display_attr_list(family_attribute_list, attrtable) - return section - def display_spouse(self, family, table, ppl_handle_list, place_lat_long): """ display an individual's partner @@ -2849,8 +2849,9 @@ class FamilyListPage(BasePage): (_("Letter"), "ColumnRowLabel"), (_("Partner 1"), "ColumnPartner"), (_("Partner 2"), "ColumnPartner"), - (_("Marriage"), "ColumnMarriage"), - (_("Divorce"), "ColumnDivorce") ] + (_("Marriage"), "ColumnDate"), + (_("Divorce"), "ColumnDate") + ] ) tbody = Html("tbody") @@ -2889,7 +2890,7 @@ class FamilyListPage(BasePage): if letter not in ltrs_displayed: trow.attr = 'class ="BeginLetter"' tcell += Html("a", letter, name =letter, - title ="Families: " + letter, inline =True) + title ="Families beginning with letter " + letter, inline =True) ltrs_displayed[letter] = True else: @@ -2930,8 +2931,8 @@ class FamilyListPage(BasePage): # family events; such as marriage and divorce events fam_evt_ref_list = family.get_event_ref_list() - tcell1 = Html("td", class_ ="ColumnMarriage", inline =True) - tcell2 = Html("td", class_ ="ColumnDivorce", inline =True) + tcell1 = Html("td", class_ ="ColumnDate", inline =True) + tcell2 = Html("td", class_ ="ColumnDate", inline =True) trow += (tcell1, tcell2) if fam_evt_ref_list: @@ -2986,10 +2987,12 @@ class FamilyPage(BasePage): self.bibli = Bibliography() self.person = person self.place_list = place_list + + BasePage.__init__(self, report, title, family.get_gramps_id()) self.up = True + birthorder = report.options["birthorder"] self.familymappages = report.options["familymappages"] - BasePage.__init__(self, report, title, family.get_gramps_id()) of = self.report.create_file(family.get_handle(), "fam") familydetailpage, head, body = self.write_header(_("Family/ Relationship")) @@ -3000,17 +3003,17 @@ class FamilyPage(BasePage): partner = db.get_person_from_handle(partner_handle) # begin FamilyDetaill division - with Html("div", class_ ="content", id ="RelationshipDetail") as familydetail: - body += familydetail + with Html("div", class_ ="content", id ="RelationshipDetail") as relationshipdetail: + body += relationshipdetail - # family media list initial thumbnail + # family media list for initial thumbnail if self.create_media: family_media_list = family.get_media_list() thumbnail = self.display_first_image_as_thumbnail(family_media_list, family) if thumbnail: - familydetail += thumbnail + relationshipdetail += thumbnail - url = self.report.build_url_fname_html(person.handle, 'ppl', up =self.up) + url = self.report.build_url_fname_html(person.get_handle(), 'ppl', up =self.up) person_link = self.person_link(url, person, _NAME_STYLE_DEFAULT, gid = person.get_gramps_id()) if partner: @@ -3030,126 +3033,41 @@ class FamilyPage(BasePage): self.page_title += "%s" % person_link elif partner: self.page_title += "%s" % partner_link - familydetail += Html("h2", self.page_title, inline =True) + relationshipdetail += Html("h2", self.page_title, inline =True) - # begin families division and section title - with Html("div", class_ = "subsection", id = "families") as section: - familydetail += section - section += Html("h4", _("Family"), inline =True) - # begin families table - with Html("table", class_ ="infolist") as table: - section += table - - gender = self.person.get_gender() - reltype = family.get_relationship() - - if reltype == gen.lib.FamilyRelType.MARRIED: - if gender == gen.lib.Person.FEMALE: - relstr = _("Husband") - elif gender == gen.lib.Person.MALE: - relstr = _("Wife") - else: - relstr = _("Partner") - else: - relstr = _("Partner") - - partner_handle = ReportUtils.find_spouse(self.person, family) - if partner_handle: - partner = db.get_person_from_handle(partner_handle) - partner_name = self.get_name(partner) - else: - partner_name = _("Unknown") - - # family relationship type - rtype = str(family.get_relationship()) - trow = Html("tr", class_ = "BeginFamily") + ( - Html("td", rtype, class_ = "ColumnType", inline = True), - Html("td", relstr, class_ = "ColumnAttribute", inline = True) - ) - table += trow - - tcell = Html("td", class_ = "ColumnValue") - trow += tcell - - # display partner's name - if partner_handle: - use_link = check_person_database(partner_handle, ppl_handle_list) - if use_link: - url = self.report.build_url_fname_html(partner_handle, "ppl", True) - tcell += self.person_link(url, partner, _NAME_STYLE_DEFAULT, - gid = partner.get_gramps_id()) - else: - tcell += self.get_name(partner) - else: - tcell += ' ' - - # display family events; such as marriage and divorce events - family_evt_ref_list = family.get_event_ref_list() - if family_evt_ref_list: - trow = Html("tr") + ( - Html("td", " ", class_ = "ColumnType", inline = True), - Html("td", " ", class_ = "ColumnAttribute", inline = True), - Html("td", self.format_family_events(family_evt_ref_list, place_lat_long), - class_ = "ColumnValue") - ) - table += trow - - tcell = Html("td", class_ ="ColumnValue") - trow += tcell - - child_ref_list = family.get_child_ref_list() - if child_ref_list: - trow = Html("tr") + ( - Html("td", " ", class_ = "ColumnType", inline = True), - Html("td", _("Children"), class_ = "ColumnAttribute", inline = True) - ) - table += trow - - tcell = Html("td", class_ = "ColumnValue") - trow += tcell - - ordered = Html("ol") - tcell += ordered - - childlist = [child_ref.ref for child_ref in child_ref_list] - - children = add_birthdate(db, childlist) - if birthorder: - children = sorted(children) - - ordered.extend( - self.display_child_link(chandle, ppl_handle_list) - for birth_date, chandle in children - ) + # display relationships + families = self.display_relationships(self.person, ppl_handle_list, place_lat_long) + if families is not None: + relationshipdetail += families # display additional images as gallery if self.create_media: addgallery = self.display_additional_images_as_gallery(family_media_list, family) if addgallery: - familydetail += addgallery + relationshipdetail += addgallery # Narrative subsection notelist = family.get_note_list() if notelist: - familydetail += self.display_note_list(notelist) + relationshipdetail += self.display_note_list(notelist) # display family LDS ordinance... family_lds_ordinance_list = family.get_lds_ord_list() if family_lds_ordinance_list: - familydetail += self.display_lds_ordinance(family) + relationshipdetail += self.display_lds_ordinance(family) # get attribute list attrlist = family.get_attribute_list() if attrlist: attrsection, attrtable = self.display_attribute_header() self.display_attr_list(attrlist, attrtable) - familydetail += attrsection + relationshipdetail += attrsection # source references srcrefs = self.display_ind_sources(family) if srcrefs: - familydetail += srcrefs + relationshipdetail += srcrefs # add clearline for proper styling # add footer section @@ -3273,18 +3191,20 @@ class PlaceListPage(BasePage): # and close the file self.XHTMLWriter(placelistpage, of) +###################################################### +# # +# Place Pages # +# # +###################################################### class PlacePage(BasePage): def __init__(self, report, title, place_handle, src_list, place_list): - """ - creates the individual place pages - """ self.bibli = Bibliography() db = report.database place = db.get_place_from_handle(place_handle) if not place: return None - BasePage.__init__(self, report, title, place.gramps_id) + BasePage.__init__(self, report, title, place.get_gramps_id()) of = self.report.create_file(place_handle, "plc") self.src_list = src_list @@ -4233,7 +4153,7 @@ class SourceListPage(BasePage): thead += trow header_row = [ - (None, "ColumnRowLabel"), + (_("Number"), "ColumnRowLabel"), (_("Source Name|Name"), "ColumnName") ] trow.extend( @@ -4872,7 +4792,7 @@ class IndividualPage(BasePage): individualdetail += sect3 # display relationships - relationships = self.display_relationships(ind_list, place_lat_long) + relationships = self.display_relationships(self.person, ind_list, place_lat_long) if relationships is not None: individualdetail += relationships diff --git a/src/plugins/webstuff/css/Web_Basic-Blue.css b/src/plugins/webstuff/css/Web_Basic-Blue.css index 855eab8e7..ba4284ca1 100644 --- a/src/plugins/webstuff/css/Web_Basic-Blue.css +++ b/src/plugins/webstuff/css/Web_Basic-Blue.css @@ -183,26 +183,22 @@ span.preposition { /* Menu Elements ================================================= */ -div#navigation ul, div#subnavigation ul { +div#navigation ul, div#subnavigation ul, div#alphabet ul { background-color: #00029D; } -div#navigation ul li, -div#subnavigation ul li { +div#navigation ul li, div#subnavigation ul li, div#alphabet ul li { border-color: #BCEAF6; } -#navigation ul li:after, #subnavigation ul li:after, -#alphabet ul li:after { +div#alphabet ul li:after { color: #FFF; } -div#navigation ul li a, div#subnavigation ul li a { +div#navigation ul li a, div#subnavigation ul li a, div#alphabet ul li a { color: #FFF; } -div#navigation ul li a:hover, -div#subnavigation ul li a:hover { +div#navigation ul li a:hover, div#subnavigation ul li a:hover, div#alphabet ul li a:hover { color: #000; } -div#navigation ul li.CurrentSection a, -div#subnavigation ul li.CurrentSection a { +div#navigation ul li.CurrentSection a, div#subnavigation ul li.CurrentSection a { background-color: #FFF; color: #00029D; font: bold .9em sans; @@ -318,10 +314,10 @@ table.infolist { } table.infolist thead tr th { color: #00029D; - margin-left: 5px; - padding-left: 20px; + margin-left: 10px; background-color: #BCEAF6; border: solid 1px #000; + font-size: 1em; } table.infolist tr td { border-bottom: dashed 1px #000; @@ -406,6 +402,15 @@ div#Individuals div table.infolist tr td p { div#Individuals div table.infolist tr td p a { display: inline; } +div#Individuals table.infolist tbody tr td.ColumnSurname a { + text-decoration: none; +} +div#Individuals table.infolist tbody tr td.ColumnSurname a:hover { + background: none; +} +div#Individuals table.infolist tbody tr td.ColumnName { + width: 20%; +} div#IndividualDetail { padding: 0; margin: 0; @@ -437,39 +442,21 @@ div#IndividualDetail div.subsection table tr td:first-child { margin: 0; padding: 0; } -#SurnameDetail p#description { - padding-top: 0; -} table.surnamelist thead tr th.ColumnSurname, #Surnames table.surnamelist tbody tr td.ColumnSurname { width: 50%; } -table.surnamelist thead tr th.ColumnSurname a { - color: #FFF; -} -table.surnamelist thead tr th { - padding: 0; -} -table.surnamelist thead tr th a, table.surnamelist thead tr th a:visited { - display: block; - text-align: left; - text-decoration: none; - padding: .2em 10px; -} -table.surnamelist thead tr th.ColumnLetter { - padding: 0px 10px 0px 20px; -} -table.surnamelist tbody tr td { - border-bottom: dashed 1px #000; -} -table.surnamelist tbody tr td.ColumnLetter a { - background: none; -} table#SortByName thead tr th.ColumnSurname, table#SortByCount thead tr th.ColumnQuantity { background-color: #00029D; color: #FFF; } +table.surnamelist thead tr th.ColumnSurname a { + color: #FFF; +} +table.surnamelist thead tr th.ColumnSurname a:hover { + color: #000; +} table#SortByName thead tr th.ColumnSurname a:after, table#SortByCount thead tr th.ColumnQuantity a:after { content: " ↓"; @@ -485,93 +472,40 @@ table.surname { border-bottom: solid 1px #000; } table.surname thead tr th.ColumnName { - width: 20%; padding-left: 20px; } -table.surname tbody tr td { - border-bottom: dashed 1px #000; -} -table.surname tbody tr td.ColumnName { - width: 20%; - padding: 0; -} -table.surname tbody tr td.ColumnName a { - color: #000; -} -table.surname tbody tr td.ColumnName a span.grampsid { - color: #000; -} table.surname tbody tr td.ColumnName:hover { background-color: #00029D; color: #FFF; } -table.surname thead tr th.ColumnParents, -table.surname tbody tr td.ColumnParents { - width: 25%; -} /* Relationships ================================================= */ -div#Relationships, div#RelationshipDetail { +div#RelationshipList, div#RelationshipDetail { margin: 0 auto; padding: 0; width: 100%; } -div#Relationships table.infolist { - width: 100%; -} -div#Relationships table.infolist thead tr th.ColumnMarriage, -div#Relationships table.infolist thead tr th.ColumnDivorce { - width: 10%; -} -div#Relationships table.infolist tbody tr.BeginFamily { - border-top: solid 1px #000; -} -div#Relationships table.infolist tbody tr td { - border-bottom: dashed 1px #000; +div#RelationshipDetail div#FamilyDetail table.infolist tbody tr td { + border: none; } /* Places =================================================----- */ div#Places, div#PlaceDetail { - font: normal 1em sans; margin: 0; padding: 0; } -div#Places table.infolist tbody tr td { - border-bottom: dashed 1px #000; -} -div#Places table.infolist tbody tr td.ColumnLetter { - width: 3%; -} -div#Places table.infolist tbody tr td.ColumnLetter a:hover { - background: none; -} -div#Places table.infolist tbody tr td.ColumnName { - width: 25%; -} div#Places table.infolist tbody tr td.ColumnState { width: 7%; } div#Places table.infolist tbody tr td.ColumnCountry { width: 6%; } -div#Places table.infolist tbody tr td.ColumnLatitude { - width: 8%; -} +div#Places table.infolist tbody tr td.ColumnLatitude, div#Places table.infolist tbody tr td.ColumnLongitude { width: 8%; } -div#PlaceDetail table.infolist tbody tr td { - border-bottom: dashed 1px #000; -} -div#PlaceDetail div#References a { - color: #000; -} -#div#PlaceDetail table.infolist tbody tr td.ColumnAttribute, -div#PlaceDetail table.infolist tbody tr td.ColumnValue { - color: #000; -} div#PlaceDetail h5 { font: bold .7cm serif; float: center; @@ -586,9 +520,6 @@ div#EventList, div#EventDetail { margin: 0; padding: 0; } -table.eventlist tbody tr td { - border-bottom: dashed 1px #000; -} table.eventlist tbody tr td.ColumnEvent { width: 10%; } @@ -610,9 +541,6 @@ div#IndividualDetail div#families table.eventlist tr td { div#EventList table.infolist tbody tr td { border-bottom: dashed 1px #000; } -div#EventList table.infolist tbody tr td.ColumnLetter a:hover { - background: none; -} div#EventList table.eventlist tbody tr.BeginName { border-top: solid 1px #000; } @@ -982,26 +910,15 @@ div#events h4 { margin-bottom: 0; border: none; } -div#events table.eventlist { - margin-top: .3em; -} -#IndividualDetail { - background-color: #FFF; -} #IndividualDetail div#events table.eventtable { width: 100%; } -#IndividualDetail div#events table.infolist thead tr th { - font-weight: bold; - font-size: 10px; - line-height: 12px; - color: #000; - padding: 6px 0px 4px 0px; - background-color: #BCEAF6; -} #IndividualDetail div#events table.infolist thead tr th:first-child { padding-left: 20px; } +table.eventlist tbody tr td.ColumnEvent { + width: 12%; +} #IndividualDetail div#events table.infolist tbody tr td { padding-top: .4em; padding-bottom: .8em; @@ -1049,9 +966,6 @@ div#parents { margin: 0; padding: 0; } -div#parents table.infolist tbody tr td.ColumnAttribute { - width: 19%; -} div#parents table.infolist tbody tr td.ColumnValue ol { margin: 0; padding-top: 0; diff --git a/src/plugins/webstuff/css/Web_Horizontal-Menus.css b/src/plugins/webstuff/css/Web_Horizontal-Menus.css index 2580c1164..0b29dd254 100755 --- a/src/plugins/webstuff/css/Web_Horizontal-Menus.css +++ b/src/plugins/webstuff/css/Web_Horizontal-Menus.css @@ -27,9 +27,9 @@ Style Name: Web_Navigation-Horizontal.css # $Id$ - Navigation + Navigation Menus ----------------------------------------------------- */ -div#navigation, div#subnavigation { +div#navigation, div#subnavigation, div#alphabet { width: 100%; margin: 0; padding: 0; @@ -41,14 +41,23 @@ div#navigation ul, div#subnavigation ul { padding: 0px 0px 0px 18px; border-bottom: solid 2px #000; } -div#navigation ul li, div#subnavigation ul li { +div#alphabet ul { + list-style: none; + min-width: 900px; + height: 28px; + margin: 0; + padding: 0px 0px 0px 18px; + border-top: solid 4px #13A926; + border-bottom: solid 2px #000; +} +div#navigation ul li, div#subnavigation ul li, div#alphabet ul li { float: left; } div#navigation ul li a, div#subnavigation ul li a { display: block; padding: 4px 12px 7px 1px; float: left; - font-size: .8em; + font-size: .9em; font-weight: bold; font-family: Helvetica, Arial, sans; text-decoration: none; @@ -62,71 +71,9 @@ div#navigation ul li a, div#subnavigation ul li a { #subnavigation ul li.CurrentSection a { border-width: 0px 0px 1px 0px; } - -/* Alphabet Navigation ------------------------------------------------------ */ -div#alphabet { - width: 100%; - margin: 0; -} -div#alphabet ul { - list-style: none; - min-width: 770px; - height: 24px; - margin: 0; - padding: 0px 0px 0px 16px; - border-width: 2px 0px 4px 0px; - border-style: solid; - border-color: #000; -} -div#alphabet ul li { - margin: 0; - float: left; +div#alphabet ul li a { + padding: 8px; } div#alphabet ul li:after { content: " |"; } -div#alphabet ul li a { - display: block; - padding: 8px 8px 8px 8px; - float: left; - font-size: .8em; - font-weight: bold; - font-family: sans-serif; - margin: 0; - text-decoration: none; -} -#alphabet ul li a:hover { - padding: 8px 8px 6px 8px; -} - -/* Marriage Report ------------------------------------------------------- */ -#MarriageReport { - height: 600px; -} -div#MarriageReport div.grouping { - width: 100%; - margin: 0; -} -div#MarriageReport div.grouping ul { - list-style: none; - min-width: 770px; - height: 26px; - margin: 0; - padding: 0px 0px 0px 16px; - border-width: 2px 0px 4px 0px; - border-style: solid; -} -div#MarriageReport div.grouping ul li { - margin: 0; - float: left; -} -div#MarriageReport div.grouping ul li a { - display: block; - padding: 8px 8px 8px 8px; - float: left; - font: bold 16px/100% sans; - margin: 0; - text-decoration: none; -}