Log in

No account? Create an account

Previous Entry | Next Entry

Provide as much information as possible, including your account type, browser type and version, the theme you're using, etc.

Tag your post. See the tag usage guidelines for the appropriate tags to use on your post. We use tags because anyone and everyone can tag entries while adding to the memories requires much more time and work.

I'm modifying a layout that someone else made. I've been playing with colors and such, and came across a few problems. It's on this journal (qtshorty1625).

Account type: Plus
Browser: IE 6.0
Theme: Mixit

1) When I view my friends page, sometimes the usernames under the icons can't be seen (I'm assuming the links are black), sometimes they're white, sometimes they're light blue, and sometimes they're dark blue; it varies by user. [Okay, this I think is based off of the colors chosen when I added friends. So I changed all the colors so there was none that had black as the forecolor. It hasn't changed yet, but I'm thinking it will just take time]. [solved]

2) There's a blue line around the userpics on my friends page and my own page. I was curious as how to change the color of this. [solved]

3) Is there a way to have a header and a background image?

/* Template: (#25) Your Biggest Flan v. Regular Width */
/* Date: March 4, 2007 */
/* S2 Style: Mixit */
/* Available at http://community.livejournal.com/thefulcrum/ */
/* Made by Liz a.k.a. grrliz.livejournal.com */

/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC BELOW --------------- */
/* -------------------------------------------------------- */

#header {position: relative; height: 240px; background: url( http://img.photobucket.com/albums/v214/18Grind33Line25/LJ%20Profile/Headers/08playoffs.png) top center no-repeat;}

- make sure that your height is the height of your graphic plus 40px
- e.g. if your graphic is 350px, your height should be 390px

/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC ABOVE --------------- */
/* -------------------------------------------------------- */

html {margin: 0px; padding: 0px; font-size: 100%; /* IE hack */ }

body {
margin: 0px;
padding: 0px;
background: black;
color: white;
font-family: "harrington", tahoma, verdana, arial, sans-serif;
font-size: 62.5%;
text-align: center;

a, a:link, a:visited, a:active {color: red; text-decoration: white;}
a:hover {color: white; text-decoration: underline;}

p {margin-top: 0.8em; margin-bottom: 0.8em;}

blockquote {margin: 0.8em 3em; padding: 1.63em; border: 1px dashed #bbbbbb; background: #e6e6e6;}

input, textarea, select {}

/* ----------------------------------------- */
/* ---------- PAGE STRUCTURE --------------- */
/* ----------------------------------------- */

/* -- don't touch the stuff below -- */

#page, #header, #content, #footer {position: relative; top: 0;}
#alpha, #beta, #gamma {display: inline; float: left; position: relative; top: 0;}
#footer {margin: -1px 0 0 0; /* HACK - removes space between content and footer */}
#page-inner, #header-inner, #content-inner, #alpha-inner, #beta-inner, #gamma-inner, #footer-inner {position: static;}
#header-inner, #alpha-inner, #beta-inner, #gamma-inner {overflow: hidden; /* hide content that is larger than the element dimensions */}
#alpha-inner[id] { overflow: visible; } /* FF MAC & PC will clip pager-top when accessing page anchor */

/* -- don't touch the stuff above -- */

#container {position: relative; margin: 0px auto; padding: 20px; font-size: 1.2em; line-height: 1.8em; text-align: left;}
#container-inner {min-height: 100%; text-align: left;}

#page {width: 760px; margin: 0px auto; padding: 0px; border: 1px solid #bbbbbb; background: black;}

#header-inner {margin: 0px auto;}

#content {text-align: left;}

#alpha {width: 560px;}
.layout-tw #alpha {float: right;}

#alpha-inner {margin: 0 20px;}

#beta {width: 200px;}
.layout-wt #beta-inner {padding: 1.8em 20px 20px 0px}
.layout-tw #beta-inner {padding: 1.8em 0px 20px 20px}

.lj-view-archive #alpha-inner,
.lj-view-month #alpha-inner,
.lj-view-tags #alpha-inner {padding-top: 20px; padding-bottom: 20px;}

/* ---------------------------- */
/* ---------- HEADER ---------- */
/* ---------------------------- */

#header-content {overflow: hidden; text-transform: uppercase; text-align: center;}

#header-text ul.nav {position: absolute; bottom: 0px; left: 0px; width: 100%; height: 40px; line-height: 40px; margin: 0px; padding: 0px; border-top: 1px dashed #bbbbbb; border-bottom: 1px dashed #bbbbbb; background: #e6e6e6; text-transform: lowercase; }
#header-text ul.nav li {margin: 0px; padding: 0 0.9em; display: inline;}
#header-text ul.nav li.item {border: 0px;}
#header-text ul.nav a {color: red; font-size: 1.4em; text-decoration: none;}
#header-text ul.nav a:hover {color: white;}

#header-name {display: none; margin: 0px auto; padding: 1.2em 0; font-size: 2em; letter-spacing: 0.1em;}
#header-name a {color: red; text-decoration: none;}
#header-name a:hover {color: white;}
#header-description {display: none; margin: 0px auto; }

/* ----------------------------- */
/* ---------- ENTRIES ---------- */
/* ----------------------------- */

/* previous and next links */
.stream-header {display: none; padding: 10px 20px; text-align: center;}
.stream-footer {padding: 0px; text-align: center;}

/* entry container */
.asset {margin: 0px; padding: 0px 0px 13px 0px; border-bottom: 1px dashed #bbbbbb;}
.asset-inner {padding: 0 0 1.8em 0; }

.asset-header {padding: 1.8em 0 0.9em 0;}
.lj-view-entry .asset-header {padding: 0; }

/* entry subject */
h2.page-header2 {margin: 0px; padding: 0.2em 0; font-size: 2em; font-weight: normal;}
h2.page-header2 a, .lj-view-tags h2 {color: red; text-decoration: none;}
h2.page-header2 a:hover {color: white;}

abbr.datetime {
margin: 0px; padding: 0px;
list-style-type: none;
color: white;
font-size: 1em;
text-transform: uppercase;
text-align: right;

/* entry body, meta, tags */
.asset-content {margin-bottom: 0.9em; padding-bottom: 0.9em; }

/* entry text */
.asset-body {padding: 0.9em 0;}

.asset-body a {color: red; font-weight: bold; border-bottom: 1px dashed #bbbbbb; text-decoration: none;}
.asset-body a:hover {color: white;}
.asset-body dt {border-bottom: 1px dashed #bbbbbb; font-weight: bold;}
.asset-body dd {margin-left: 3.6em; padding: 10px; background: #e6e6e6; border: 1px dashed #bbbbbb; border-top: 0px; }

/* date and time */
div.asset-header ul {margin: 0px !important; padding: 0px !important;}
div.asset-header li.item {padding: 0px;}

.ljuser {display: inline !important;}

/* userpic */
.user-icon {float: right; margin-left: 5px; padding: 1px; background: transparent !important; text-align: center;}
.user-icon img {border: 1px solid #82cadb;}
.user-icon span {background: black !important; text-align: center;}

/* mood, music, location */
.lj-currents ul {margin: 0px; padding: 0px;}
.lj-currents ul li {list-style: none;}
.lj-currents img {display: none;}

.entryMetadata-label {font-weight:bold;}
.entryMetadata-content {margin-left: 2px;}

/* --- tags --- */
.asset-tags-header {
display: block; float: left;
width: 3.5em; /* matches .asset-tags-content width */
height: 100% !important;
margin: 0px; padding: 0px;
font-size: 1em !important;
.asset-tags-list {margin: 0 0 0 3.5em; padding: 0px; list-style-type: none;}
.asset-tags-list li {display: inline; padding-right: 5px;}
.asset-tags-list a {white-space: normal !important;}

/* comments bar */
ul.asset-meta-list {clear: both; margin: 0px; padding: 0px; list-style-type: none;}
li.asset-meta-comments {display: inline; margin: 0px 10px 0px 0px;}

ul.asset-meta-list .item {border: 0px;}

.prevnext, .prev, .next {padding: 5px 0px;}

/* ----------------------------- */
/* ---------- SIDEBAR ---------- */
/* ----------------------------- */

.widget {margin-bottom: 20px;}
.widget-inner {}

.widget-header {margin: 0px 0px 5px 0px; padding: 0px 0px 5px 0px; color: red; border-bottom: 1px dashed #bbbbbb; font-size: 1.3em; text-transform: uppercase;}
.widget-content {margin: 0px; padding: 0px;}

.widget ul {margin: 0px; padding: 0px 0px 0px 20px;}
.widget a {color: white;}
.widget a:hover {color: red; text-decoration: none;}

/* profile */
.about-me-widget {display: none; text-align: center;}
.about-me-widget .widget-header a {color: white;}
.about-me-widget .widget-header a:hover {color: white;}
.about-me-widget dl, .about-me-widget dd, .about-me-widget dt {margin: 0px; padding: 0px; width: 100%;}

/* calendar */
.calendar-widget {}
.calendar-widget table {width: 100%; text-align: center;}
.calendar-widget p {margin: 5px 0px; padding: 0px; text-align: center;}
.calendar-widget tr:first-child a {background: black; border: 0px;}
.calendar-widget td a {display: block; width: 100%; color: red; background: #e6e6e6; border: 1px solid #bbbbbb;}

/* link list */
.typelist-widget li.item {margin: 0px; padding: 0px; }

/* tags */
.categories-widget .widget-footer {padding: 20px 0px 0px 0px;}
.categories-widget li.item {margin: 0px; padding: 0px;}
.categories-widget li.tag {display: inline; padding: 0px 1px; background: none; }

/* post summary */
.archive-widget li.item {margin: 0px 0px 5px 0px; padding: 0px;}

.links-widget .widget-list .item {
margin-bottom: .2em;
border: none !important;

.widget-list .tagcloud {
list-style: none !important;
display: inline !important;
color: white !important;
white-space: nowrap !important;
border-left: 0 !important;
width: 100% !important;

/* syndication, LiveJournal link, designer link */
.designed-widget {display: none;}

/* ----------------------------------- */
/* ---------- COMMENTS PAGE ---------- */
/* ----------------------------------- */

/* Comments ---------------------------------------*/
#comments {padding: 0px;}

div.comments-inner h2 {margin: 0px; padding: 1.5em 0 0 0; color: red; font-size: 2em; font-weight: normal;}

.comment {margin-bottom: 1.8em; padding: 0.9em 0; border-bottom: 1px dashed #bbbbbb;}
.comment-odd {}
.comment-even {background: black;}

.comments-nav {margin: 20px; text-align:center;}

/* --- reply, freeze, screen, etc --- */
.comment-links {margin-top: 0.9em; font-weight: normal; text-align: right; font-size: 1em;}
.comment-subject {font-weight: bold; }
.comment-date {margin-top: 0.9em; margin-bottom: 0.9em;}

/* Fix height in IE */
.comment {height: 1%;}

/* Quick Reply ---------------------------------------*/
.quickreply {margin-top: 1em; width:90%; padding-top: 5px; padding-bottom: 10px;}

#commenttext, #subject {width: 90%;}

#comment-form {width: 500px;}

/* ------------------------------ */
/* ---------- ARCHIVES ---------- */
/* ------------------------------ */

/* Calendar/Archive ---------------------------------------------------------------------- */

ul.year {text-align: center; padding: 0px;}
ul.year li {display: inline; padding: 0px 5px;}

table.yeartable {margin-left: auto; margin-right: auto;}
table.yeartable td.yeardate, table.yeartable td.yearday {border: 1px solid #bbbbbb;}
table.yeartable td.yearday {background-color: black; text-align: center;}
td.yearmonth {border-style: none; font-weight: bold;}

dd.viewsubjects {margin: 0 0 .75em .75em;}

.lj-view-month table {}
.lj-view-month widget table {margin: 0px !important;}

/* -------------------------- */
/* ---------- MISC ---------- */
/* -------------------------- */

/* Sponsored Plus ---------------------------------------*/

#ad-5linkunit {
clear: both;

#ad-leaderboard {
margin-bottom: 10px;

/* Utility Code --------------------------------------------------- */

/* clear floats, inspired by positioniseverything.net/easyclearing.html */
.widget .user-pic:after {
content: ".";
display: block;
visibility: hidden;
clear: both;
height: 0.1px;
font-size: 0.1em;
line-height: 0.1px;

/* float in post bodies around enclosures */
.asset-body {
height: 1%;

/* Win IE < 7 */
* html #header-name a { word-wrap: break-word; }

/* ----------------------------------------------------------------------- */
/* ----------------------------------------------------------------------- */


( 4 comments — Leave a comment )
Apr. 7th, 2008 03:33 pm (UTC)
1) The colors of the ljuser links on the friends page are set on the Manage Friends page. Maybe you missed a few that are still set to black?

2) There is a line in the existing CSS like this:
.user-icon img {border: 1px solid #82cadb;}
Just change the italic portion to change the border color.

3) A header and background where? If you mean a page background, yes, you can have both.
Apr. 7th, 2008 11:18 pm (UTC)
1) Okay, that's what I was thinking. I'll go and double check that.

2)I figured it was in there somewhere, but I was looking for the word "color." Thanks!

3) This was more of a generic question b/c I had wanted to do it in the past, but I couldn't seem to do it if I used the given templates. Yes, I meant a page background. I was contemplating instead of having a solid background having an image. I thought it might be possible with coding. I don't know a whole lot about coding, but since there aren't any preexisiting sports layouts (and I couldn't seem to find any in any of the communities I searched), I had to try and modify on my own. What is the coding for inserting a background image? I'm assuming it's something with bg img (okay, that looks wrong to me, but I think you get the idea).
Apr. 8th, 2008 02:41 am (UTC)
Towards the top of the CSS is a section for the body element, and in that is a line
background: black;

Change that to add a background image. There's a tutorial for different ways to use backgrounds at W3Schools.com.
Apr. 16th, 2008 10:23 pm (UTC)
Thank you! I'll have to check out that site!
( 4 comments — Leave a comment )

Latest Month

March 2016

S2 Help Communities


Powered by LiveJournal.com
Designed by chasethestars