viHistory

PB sent me a large jpg to use as a banner on the conference site. Took a couple of guesses to get something the correct dimensions. Also modified the bg of the image from white to the taupe colour used on the site - they were OK with that.

Turned out that
- headerTitle div had a number of peculiar styling rules
- #header h1 had odd padding settings which resulted in the banner being noticeably off-center
I overruled by adding a selector in the cha2013styles.css file. Noticed that a lot of elements have a lot of instances of selectors and conflicting style rules applied to them - sometimes 2 or 3 selectors for the same id in the same css file.

Finally, it seems that the CMS doesn't like comments in css files, so I can't include any.

Here's the contents of the modified css file to date (with comments added here by me):

/*hide certain items in the nav-bar at the top of the page*/
/*
not logged in
li:nth-child(1) = home http://conferences.uvic.ca/index.php/index/index/index/index
li:nth-child(2) = about http://conferences.uvic.ca/index.php/cha/index/about
li:nth-child(3) = log in http://conferences.uvic.ca/index.php/cha/index/login
li:nth-child(4) = account http://conferences.uvic.ca/index.php/cha/index/user/account
li:nth-child(5) = search http://conferences.uvic.ca/index.php/cha/index/search
li:nth-child(6) = announcements http://conferences.uvic.ca/index.php/cha/index/announcement
logged in
li:nth-child(1) = home http://conferences.uvic.ca/index.php/index/index/index/index
li:nth-child(2) = about http://conferences.uvic.ca/index.php/cha/index/about
li:nth-child(3) = user home http://conferences.uvic.ca/index.php/index/cha2013/user
li:nth-child(4) = search http://conferences.uvic.ca/index.php/cha/index/search
li:nth-child(5) = announcements http://conferences.uvic.ca/index.php/cha/index/announcement
*/

div#navbar ul.menu li:nth-child(1),
div#navbar ul.menu li:nth-child(2),
div#navbar ul.menu li:nth-child(4) {
display:none;
}

div#navbar ul.menu li a[href$=account] {
display:none;
}
div#navbar ul.menu li a[href$=search] {
display:none;
}
div#navbar ul.menu li a[href$=announcement] {
display:none;
}

/* make header have thinner border on bottom and mirror it on top */
#header {
border-bottom: 1px solid #898E79;
border-top: 1px solid #898E79;
}

/* get rid of odd padding around h1 in header to ensure contents are centered */
#header h1 {
padding: 0 0 0 0;
}

/* headerTitle has a barrage of selectors and style rules, over-rule them all
most importantly over-rule the fixed height so the banner image can be contained elegantly */
#headerTitle {
height: 100%;
padding-bottom: 0px;
padding-top: 0px;
margin-bottom: 0px;
margin-left:0;
}