style_system | Styling comments and notifications

(OK, I fumbled this one and posted it to the wrong comm, so this time I'm double checking to make sure it goes to the right location)

My question is this: I would like to style replies and IP address notifications for

mag7wallpapers.

Using Firebug I discovered that span.de is what I needed to style. I followed the instructions used on this web page but the result wasn't exactly what I was hoping for. The notice now covers the Post comment, Preview and More options buttons, and I can't figure out how to separate the two.

I would also like to lower the Quote button next to Subject, or move it up - make that whole area neater, because the elements are all over the place - if it can be done. And also, have the notice expand to the width of the textarea.

(click to enlarge)

Help?

Original css:

/*
Layout: TOP OF THE CLASS 
Theme: STUDIOUS

CREDITS
CSS: Sarken - http://sarken.dreamwidth.org/1751138.html
Icons: Yusuke Kamiyamane - http://p.yusukekamiyamane.com/
Colors: Mgine - http://www.colourlovers.com/palette/1305411
*/

body {
background-color: #3D3E40;
color: #222;
font-family: 'Lucida Grande', Helvetica, sans-serif;
margin: 0;
padding: 0;
border: 0;
}

a {
color: #3D3E40;
}

a:hover {
color: #3D3E40;
}

a:visited {
color: #3D3E40;
}

#canvas {
margin: 11em auto 0;
padding: 0;
}

#primary {
background-color: #9EBFB8;
width: 100%;
padding: .5em 0 .25em 0;
margin: 0 auto;
clear: both;
}

#primary > .inner:first-child {
padding: 0;
margin: 0;
}

.one-column #secondary {
position: absolute;
top: 0;
left: 0;
width: 100%;
font-size: 75%;
padding-bottom: .5em;
color: #DBD5CC;
z-index: 50;
}

.has-navstrip #secondary {
position: absolute;
top: 50px;
left: 0;
width: 100%;
font-size: 75%;
padding-bottom: .5em;
color: #DBD5CC;
z-index: 50;
}

#secondary .inner {
margin: 0 2em 0 0;
padding: 0;
}

#secondary > .inner:first-child {
padding: 0;
margin: 0 0 0 -2em;
}

.one-column #tertiary {
clear: both;
margin: .5em auto 1em auto;
width: 100%;
font-size: 75%;
color: #DBD5CC;
}

#tertiary .inner {
margin: 0 2em 0 0;
padding: 0;
}

#tertiary > .inner:first-child {
padding: 0;
margin: 0 0 0 -2em;
}

/*HEADER*/

#header {
position: absolute;
top: 0;
left: 2em;
padding: 0;
margin: .5em;
background-color: transparent;
color: #ECE4DC;
width: 20%;
height: 11em;
z-index: 20;
}

.has-navstrip #header {
position: absolute;
top: 45px;
left: 2em;
}

#header > .inner {
padding: 0;
margin: 0;
text-align: center;
}

h1#title {
padding: 0;
margin: .5em 0 0 0;
font-style: italic;
font-family: Georgia, serif;
font-weight: normal;
font-size: 140%;
}

h2#subtitle {
padding: 0;
margin: 0;
font-family: 'Lucida Grande', Helvetica, sans-serif;
font-weight: normal;
font-size: 90%;
}

h2#pagetitle {
display: none;
}

/*ALL MODULE SECTIONS*/

.module {
margin: 0;
padding: 0;
border: 0;
}

.module a {
color: #D94848;
text-decoration: none;
}

.module a:visited {
color: #82BCB0;
}

.module a:hover {
color: #E0D9D1;
text-decoration: underline;
}

.module .module-header {
color: #93BFB7;
padding-bottom: 0px;
border-bottom: 1px #6C6E72 dotted;
width: 95%;
}

.module .module-header a {
color: #93BFB7;
width: 95%;
}

.module .module-content {
width: 94%;
}

div.module-calendar .module-content a {
text-decoration: underline;
}

div.module-calendar .module-content td.entry-day, div.module-calendar .module-content td.empty-day {
border: 1px #4E4F52 solid;
}

.module-userprofile .module-content {
text-align: center;
min-height: 100px;
}

.module-userprofile .userpic {
float: left;
margin-right: .75em;
padding: 2px;
}

.module-userprofile .userpic img {
width: 65px;
height: 65px;
padding: 4px;
border: 1px #4E4F52 solid;
}

.module-userprofile .journal-name {
padding-top: 20px;
}

.module-userprofile ul.userlite-interaction-links {
margin-top: .25em;
}

/*TOP MODULES*/

#secondary .module {
float: right;
width: 24%;
background-color: #3D3E40;
}

#secondary div.module-navlinks ul.module-list {
padding: .75em 0 0 0;
margin: 0;
}

#secondary div.module-navlinks ul.module-list li {
list-style: none;
}

#secondary div.module-navlinks ul.module-list li a {
display: block;
background-color: #BA3E3E;
text-align: center;
color: #F8F3EC;
}

#secondary div.module-calendar .module-content {
font-size: 75%;
padding-bottom: 0;
}

#secondary .module-typelist .module-header {
text-align: center;
}

#secondary .module-typelist .module-content {
text-align: center;
}

#secondary .module-typelist .module-content ul {
margin: 0;
padding: 0;
}

#secondary .module-typelist .module-content ul li {
list-style: none;
margin: .15em 0;
}

/*NAVIGATION TOP*/

.topnav {
margin: 0 10%;
text-align: left;
}

/*ENTRIES*/

div.entry {
background-color: #BA3E3E;
padding: 0;
width: 70%;
margin: 0 auto 2em auto;
border: 0;
}

div.entry > div.inner {
background-color: #F8F3EC;
padding: 0;
margin: 0 140px 0 0;
border: 0;
}

div.entry div.header {
letter-spacing: 1px;
padding: .5em .5em .5em .65em;
margin: 0 0;
background-color: #F8F3EC;
}

div.entry div.header a {
text-decoration: none;
}

div.entry h3.entry-title {
font-size: 150%;
padding: .15em 0;
margin: 0 0 0 0;
color: #4E4F52;
}

div.entry h3.entry-title a {
color: #4E4F52;
}

div.entry h3.entry-title a:hover {
color: #93BFB7;
}

div.entry span.datetime {
text-transform: uppercase;
padding: 0;
font-size: 75%;
color: #AAA;
}

div.entry span.datetime a {
color: #AAA;
}

div.entry span.access-filter img {
display: none;
}

div.entry span.restrictions img {
display: none;
}

div.entry-content {
margin: 0 0;
padding: .75em 1.5em 2em 1.5em;
text-align: justify;
min-height: 80px;
background-color: #F8F3EC;
font-size: 95%;
color: #222;
}

div.entry-content a {
color: #67A89B;
}

div.entry-content a:hover {
color: #67A89B;
}

div.entry div.userpic {
float: right;
clear: left;
margin: 0 -140px 0 0;
width: 140px;
text-align: center;
}

div.entry div.userpic img {
padding: 4px;
margin-top: -30px;
margin-bottom: 2px;
border: 1px solid #D94848;
}

div.entry span.poster {
float: right;
clear: both;
text-align: center;
margin: 0 -139px 0 0;
font-size: 60%;
width: 138px;
color: #222;
}

div.entry span.poster a {
color: #F8F3EC;
font-weight: normal;
text-decoration: none;
}

div.entry span.poster img {
display: none;
}

div.entry div.metadata {
font-size: 80%;
margin: 0 0;
padding: 0 0 0 1.5em;
color: #BFBFBF;
background-color: #F8F3EC;
}

div.entry div.metadata span.metadata-item {
color: #BA3E3E;
}

div.entry div.metadata ul, div.entry div.metadata ul li {
margin-bottom: 0;
}

div.entry div.footer {
margin: 0 0;
padding: 0 1em .75em 1.5em;
background-color: #F8F3EC;
}

div.entry div.footer div.tag {
color: #BFBFBF;
font-size: 80%;
margin: 0 0 0 0;
}

div.entry div.footer div.tag ul li a {
color: #4E4F52;
}

ul.entry-management-links {
margin: 0;
padding-top: .85em;
text-align: center;
}

ul.entry-interaction-links {
margin: 0;
text-align: center;
}

ul.entry-management-links a, ul.entry-management-links a:hover, ul.entry-management-links a:visited, ul.entry-interaction-links a, 
ul.entry-interaction-links a:hover, ul.entry-interaction-links a:visited {
color: #BA3E3E;
}

/*COMMENTS*/

#comments {
width: 70%;
margin: 0 auto;
padding: 0;
}

div.comment {
background-color: #F8F3EC;
border-bottom: .25em #BA3E3E solid;
margin: 0;
padding: 0;
}

.comment-wrapper-even div.comment {
border-bottom: .25em #3D3E40 solid;
}

div.comment div.header {
margin: 0;
font-size: 80%;
background-color: #BA3E3E;
}

.comment-wrapper-even div.comment div.header {
background-color: #3D3E40;
color: #F8F3EC;
}

div.comment div.comment-title {
background-color: #9EBFB8;
}

div.comment div.comment-title h4 a {
padding: .25em .25em 0 .25em;
text-transform: uppercase;
text-decoration: none;
font-weight: normal;
font-size: 110%;
color: #222;
}

div.comment span.datetime {
padding: .25em .25em 0 .25em;
margin: 0;
}

div.comment span.poster {
font-size: 80%;
}

div.comment span.poster-ip {
font-size: 80%;
color: #3D3E40;
}

div.comment div.contents {
padding: 0 0 0 .25em;
margin: 0;
}

div.comment div.userpic {
float: right;
width: 76px;
text-align: center;
margin: .5em;
}

div.comment div.userpic img {
width: 70px;
height: 70px;
border: 3px #DBD5CC solid;
}

div.comment div.comment-content {
margin: 0;
padding: 1em 0 .5em .75em;
font-size: 95%;
}

div.comment div.footer {
margin: 0;
clear: both;
padding: .5em .25em;
text-align: right;
font-size: 80%;
text-transform: uppercase;
}

ul.comment-management-links {
margin: 0;
text-align: center;
}

ul.comment-interaction-links {
margin: 0;
text-align: center;
}

ul.comment-management-links a, ul.comment-management-links a:hover, ul.comment-management-links a:visited, ul.comment-interaction-links a, 
ul.comment-interaction-links a:hover, ul.comment-interaction-links a:visited {
color: #BA3E3E;
}

/*REPLY PAGE*/

.page-reply .comment {
width: 70%;
margin: 0 auto 1em auto;
border: 0;
background-color: #F8F3EC;
}

#qrform table { 
border: 0 !important;
}

table.talkform {
width: 70%;
padding: 0 2em;
border-top: .75em solid #BA3E3E;
border-bottom: .35em solid #BA3E3E;  
background-color: #F8F3EC; 
margin: 0 auto;
}

input, select, textarea {
border: 1px solid #BA3E3E;
background-color: #F8F3EC;
}

/*NAVIGATION BOTTOM*/

.bottomcomment {
padding-bottom: 1em;
text-align: center;
}

.bottomcomment ul {
padding-bottom: .75em;
}

.bottomcomment ul a, .bottomcomment ul a:visited {
color: #3D3E40;
}

.bottomnav {
margin: 0 10% 0 0;
padding-bottom: .4em;
text-align: right;
}

/*BOTTOM MODULES*/

#tertiary .module {
float: right;
width: 24%;
margin: 0 0 1em 0;
}

#tertiary .module .module-content ul {
list-style-position: inside;
}

#tertiary .module-tags_cloud {
width: 48%;
}

#tertiary .module-tags_cloud .module-content {
text-align: justify;
margin: 0;
padding: 0 1.5em;
}

#tertiary .module-tags_cloud .module-content ul {
margin: 0;
padding: 0 1.5em 0 0;
}

#tertiary .module-tags_cloud .manage-tags-link {
text-align: right;
text-transform: uppercase;
margin-bottom: .75em;
}

#tertiary .module-active .module-content ul.module-list {
list-style-type: none;
list-style-position: outside;
}

#tertiary .module-time, #tertiary .module-powered, #tertiary .module-syndicate {
clear: both;
margin: 0 0 1em 0;
width: 95%;
}

#tertiary .module-syndicate .module-header {
display: none;
}

#tertiary .module-time .module-content, #tertiary .module-powered .module-content, #tertiary .module-syndicate .module-content {
text-align: right;
text-transform: uppercase;
font-size: 90%;
}

/*FOOTER*/

#footer {
text-align: center;
font-size: 80%;
text-transform: uppercase;
background-color: #3D3E40;
}

#footer a {
color: #ECE4DC;
}

/*ARCHIVE*/

.page-archive div.month {
margin: .25em auto 1.75em auto;
padding: 0;
width: 70%;
float: none;
margin: .25em auto 1.75em auto;
background-color: #F8F3EC;
}

.page-archive div.month h3 {
background-color: #3D3E40;
color: #F8F3EC;
padding: 0 .5em;
}

.page-archive div.month table { 
width: 70%; 
margin: 1em auto;
}

.page-archive div.month td {
border: 1px #D94848 solid;
}

.page-archive div.month th {
text-align: center; 
margin: 0 2px; 
font-weight: normal;
border: 1px #D94848 solid; 
}

.page-archive div.month td.day-has-entries p { 
padding: 0 0 0 5px; 
margin: 0; 
display: inline; 
}

.page-archive div.month div.footer {
text-align: right;
padding: .5em;
}

.page-month #archive-month { 
background-color: #F8F3EC;
width: 70%;
margin: 0 auto;
clear: both;
}

.page-month #archive-month > .inner {
margin: .5em 2em;
padding-top: .5em;
}

.page-month dt a {
font-size: 110%;
color: #4E4F52;
}

.page-month dd {
border-bottom: 1px dotted #DBD5CC;
margin-bottom: .75em;
}

.page-month .month div.tag {
margin-left: .75em;
font-size: 85%;
}

.page-day h3.day-date {
text-align: center;
}

/*TAGS PAGE*/

.page-tags .tags-container {
margin: 1em auto;
width: 70%;
padding: 0;
background-color: #F8F3EC;
}

.page-tags .tags-container h2 { 
padding: 0 .5em; 
margin: 0;
background-color: #BA3E3E;
color: #F8F3EC;
}

.page-tags .ljtaglist ul {
list-position: inside;
}

.page-tags .manage-tags-link {
text-align: right;
padding: 0 .5em .5em .5em;
}

/*LOCKED AND RESTRICTED ENTRIES*/

img[src*='locked.png'], img[src*='filtered.png'], img[src*='private.png'], img[src*='icon_18.png'], img[src*='icon_nsfw.png'] {
width: 0;
height: 0;
padding: 0 5px 18px 0;
}

.security-protected .entry .entry-title, img[src*='locked.png']{
padding-left: 20px;
background: transparent url('http://yoursite/images/securityprotected.png') no-repeat center left;
}

.security-filtered .entry .entry-title, img[src*='filtered.png'] {
padding-left: 20px;
background: transparent url('http://yoursite/images/securityfiltered.png') no-repeat center left;
}

.security-private .entry .entry-title, img[src*='private.png'] {
padding-left: 20px;
background: transparent url('http://yoursite/images/securityprivate.png') no-repeat center left;
}

.restrictions-18 .entry .entry-title a, img[src*='icon_18.png'] {
padding-left: 20px;
background: transparent url('http://yoursite/images/restricted18.png') no-repeat center left;
}

.restrictions-NSFW .entry .entry-title a, img[src*='icon_nsfw.png'] {
padding-left: 20px;
background: transparent url('http://yoursite/images/restrictednsfw.png') no-repeat center left;
}

/*ICONS*/

img[src*='edit.png'] {
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/edit.png') no-repeat;
}

img[src*='tag_edit.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/tagsedit.png') no-repeat;
}

img[src*='memories_add.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/addmemories.png') no-repeat;
}

img[src*='track.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/track.png') no-repeat;
}

img[src*='tellafriend.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/tellafriend.png') no-repeat;
}

img[src*='next.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/entrynext.png') no-repeat;
}

img[src*='previous.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/entryprevious.png') no-repeat;
}

img[src*='anonymous.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/anonymous.png') no-repeat;
}

img[src*='delete.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/delete.png') no-repeat;
}

img[src*='screen.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/screen.png') no-repeat;
}

img[src*='unscreen.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/unscreen.png') no-repeat; 
}

img[src*='freeze.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/freeze.png') no-repeat;
}

img[src*='unfreeze.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/unfreeze.png') no-repeat;
}

img[src*='subscription_add.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/subscribeadd.png') no-repeat; 
}

img[src*='subscription_remove.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/subscriberemove.png') no-repeat;
}

img[src*='access_grant.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/accessgrant.png') no-repeat;
}

img[src*='access_remove.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/accessremove.png') no-repeat; 
}

img[src*='community_join.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/communityjoin.png') no-repeat;
}

img[src*='community_leave.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/communityleave.png') no-repeat; 
}

img[src*='post.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/post.png') no-repeat; 
}

img[src*='message.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/message.png') no-repeat;
}

img[src*='sticky_entry.png'] {
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://yoursite/images/sticky.png') no-repeat; 
}

.ljuser img {
width: 0;
height: 0;
background-image: none;
padding: 0 0 16px 18px;
}

img[src*='user.png'] { 
width: 0; height: 0; 
padding: 0 0 16px 18px; 
background: url('http://yoursite/images/user.png') no-repeat; 
vertical-align: middle !important;
}

img[src*='user.png'], img[src*='lj-userinfo.gif'], img[src*='userinfo.gif'], img[src*='user_other.png'], img[src*='user_staff.png'], img[src*='.ico'] { 
background: url('http://yoursite/images/user.png') no-repeat bottom left;
padding: 0 0 16px 18px;
}

img[src*='community.png'], img[src*='community.gif'], img[src*='comm_staff.png'] { 
background: url('http://yoursite/images/community.png') no-repeat bottom left;
padding: 0 0 16px 18px;
width: 0; height: 0;  
}

img[src*='openid.png'] {
background: url('http://yoursite/images/openid.png') no-repeat bottom left;
padding: 0 0 16px 18px;
width: 0; height: 0;
}

/*CONTEXTUAL POP-UP*/

div.ContextualPopup div.Inner { 
font-family: 'Lucida Grande', Helvetica, sans-serif;
background: #F8F3EC; 
border: 3px double #BA3E3E; 
color: #3D3E40; 
padding: 3px; 
text-transform: lowercase;
}

div.ContextualPopup .Content { 
padding: 1em;
}

div.ContextualPopup .Relation { 
margin-bottom: .8em;
}

div.ContextualPopup .Userpic { 
float: right; 
width: 50px; height: 50px; 
padding: 4px; 
border: 1px solid #D94848; 
margin-right: .5em;
}

div.ContextualPopup img { 
border: 0;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { 
color: #4E4F52; 
font-weight: normal;
}

/*CONTROL STRIP*/

#lj_controlstrip {
background-color: #4E4F52;
background-image: none;
border-bottom: 1px dotted #BA3E3E;
}

#lj_controlstrip a {
font-family: 'Lucida Grande', Helvetica, sans-serif;
color: #9EBFB8;
}

#lj_controlstrip_statustext, #lj_controlstrip_actionlinks, #lj_controlstrip_search {
font-family: 'Lucida Grande', Helvetica, sans-serif !important;
color: #DBD5CC !important;
}

#lj_controlstrip_login input, #lj_controlstrip_login input#xc_user, #lj_controlstrip_login input#xc_password,
#lj_controlstrip_user input, #lj_controlstrip_search select, #lj_controlstrip_search input, 
#lj_controlstrip_search input#search, #lj_controlstrip_actionlinks select, #lj_controlstrip_actionlinks input {
padding: 0px 2px;
text-transform: uppercase;
font-family: 'Lucida Grande', Helvetica, sans-serif;
color: #3D3E40;
border: 1px solid #3D3E40;
background-color: #DBD5CC;
}

#lj_controlstrip_login input:hover, #lj_controlstrip_user input:hover, #lj_controlstrip_search input:hover, 
#lj_controlstrip_actionlinks input:hover {
color: #DBD5CC;
border: 1px solid #DBD5CC;
background-color: #3D3E40;
}

#lj_controlstrip_search input#search {
text-transform: none;
}

Edited css:

/*
Layout: TOP OF THE CLASS 
Theme: STUDIOUS

CREDITS
CSS: Sarken - http://sarken.dreamwidth.org/1751138.html
Icons: Yusuke Kamiyamane - http://p.yusukekamiyamane.com/
Colors: Mgine - http://www.colourlovers.com/palette/1305411
*/

body {
background-color: #2B1B05;
color: #222;
font-family: 'Lucida Grande', Helvetica, sans-serif;
margin: 0;
padding: 0;
border: 0;
}

a {
color: #3D3E40;
}

a:hover {
color: #3D3E40;
}

a:visited {
color: #3D3E40;
}

ul li {
margin: 0px 0px 0px 15px;
padding: 0px;
list-style: disc;
list-style-position: inside;
}

ol li {
margin: 0px 0px 0px 15px;
padding: 0px;
list-style-position: inside;
list-style: decimal;
}

#canvas {
margin: 11em auto 0;
padding: 0;
}

#primary {
background-color: #cfcac2;
width: 100%;
padding: .5em 0 .25em 0;
margin: 0 auto;
clear: both;
}

#primary > .inner:first-child {
padding: 0;
margin: 0;
}

.one-column #secondary {
position: absolute;
top: 0;
left: 0;
width: 100%;
font-size: 75%;
padding-bottom: .5em;
color: #DBD5CC;
z-index: 50;
}

.has-navstrip #secondary {
position: absolute;
top: 50px;
left: 0;
width: 100%;
font-size: 75%;
padding-bottom: .5em;
color: #DBD5CC;
z-index: 50;
}

#secondary .inner {
margin: 0 2em 0 0;
padding: 0;
}

#secondary > .inner:first-child {
padding: 0;
margin: 0 0 0 -2em;
}

.one-column #tertiary {
clear: both;
margin: .5em auto 1em auto;
width: 100%;
font-size: 75%;
color: #DBD5CC;
}

#tertiary .inner {
margin: 0 2em 0 0;
padding: 0;
}

#tertiary > .inner:first-child {
padding: 0;
margin: 0 0 0 -2em;
}

/*HEADER*/

#header {
position: absolute;
top: 0;
left: 2em;
padding: 0;
margin: .5em;
background-color: transparent;
color: #ECE4DC;
width: 20%;
height: 11em;
z-index: 20;
}

.has-navstrip #header {
position: absolute;
top: 45px;
left: 2em;
}

#header > .inner {
padding: 0;
margin: 0;
text-align: center;
}

h1#title {
padding: 0;
margin: .5em 0 0 0;
font-style: italic;
font-family: Georgia, serif;
font-weight: normal;
font-size: 140%;
}

h2#subtitle {
padding: 0;
margin: 0;
font-family: 'Lucida Grande', Helvetica, sans-serif;
font-weight: normal;
font-size: 90%;
}

h2#pagetitle {
display: none;
}

/*ALL MODULE SECTIONS*/

.module {
margin: 0;
padding: 0;
border: 0;
}

.module a {
color: #D94848;
text-decoration: none;
}

.module a:visited {
color: #82BCB0;
}

.module a:hover {
color: #E0D9D1;
text-decoration: none;
}

.module .module-header {
font-family: Georgia;
font-style: italic;
color: #92B0AA;
padding-bottom: 0px;
border-bottom: 1px #6C6E72 dotted;
width: 95%;
}

.module .module-header a {
color: #92B0AA;
width: 95%;
}

.module .module-content {
width: 94%;
}

div.module-calendar .module-content a {
text-decoration: none;
border-bottom: 1px #4e4f52;
}

div.module-calendar .module-content td.entry-day, div.module-calendar .module-content td.empty-day {
border: 1px #4E4F52 dotted;
}

.module-userprofile .module-content {
text-align: center;
min-height: 100px;
}

.module-userprofile .userpic {
float: left;
margin-right: .75em;
padding: 2px;
}

.module-userprofile .userpic img {
width: 77px;
height: 77px;
padding: 4px;
border: 1px #4E4F52 solid;
}

.module-userprofile .journal-name {
padding: 5px 0 5px 0;
font-family: Georgia;
font-style: italic;
font-size: 170%;
}

.module-userprofile ul.userlite-interaction-links {
margin-top: .25em;
}

/*TOP MODULES*/

#secondary .module {
float: right;
width: 24%;
background-color: #2B1B05;
}

#secondary div.module-navlinks ul.module-list {
padding: .75em 0 0 0;
margin: 0;
}

#secondary div.module-navlinks ul.module-list li {
list-style: none;
}

#secondary div.module-navlinks ul.module-list li a {
display: block;
padding: 2px 0;
font-weight: bold;
color: #F8F3EC;
background-color: #BA3E3E;
text-align: center;
}

#secondary div.module-calendar .module-content {
font-size: 75%;
padding-bottom: 0;
}

#secondary .module-typelist .module-header {
text-align: center;
}

#secondary .module-typelist .module-content {
text-align: center;
}

#secondary .module-typelist .module-content ul {
margin: 0;
padding: 0;
}

#secondary .module-typelist .module-content ul li {
list-style: none;
margin: .15em 0;
}

/*NAVIGATION TOP*/

.topnav {
margin: 0 10%;
text-align: left;
}

/*ENTRIES*/

div.entry {
background-color: #BA3E3E;
padding: 0;
width: 75%;
margin: 0 auto 2em auto;
border: 0;
}

div.entry > div.inner {
background-color: #F8F3EC;
padding: 0;
margin: 0 140px 0 0;
border: 0;
}

div.entry div.header {
letter-spacing: 1px;
padding: .5em .5em .5em .65em;
margin: 0 0;
background-color: #F8F3EC;
}

div.entry div.header a {
text-decoration: none;
}

div.entry h3.entry-title {
font-size: 150%;
padding: .15em 0;
margin: 0 0 0 0;
color: #4E4F52;
}

div.entry h3.entry-title a {
color: #4E4F52;
}

div.entry h3.entry-title a:hover {
color: #93BFB7;
}

div.entry span.datetime {
text-transform: uppercase;
padding: 0;
font-size: 75%;
color: #AAA;
}

div.entry span.datetime a {
color: #AAA;
}

div.entry span.access-filter img {
display: none;
}

div.entry span.restrictions img {
display: none;
}

div.entry-content {
margin: 0 0;
padding: .75em 1.5em 2em 1.5em;
text-align: justify;
min-height: 80px;
background-color: #F8F3EC;
font-size: 95%;
color: #222;
	border-bottom: 1px solid #D3DFA7;
}

div.entry-content img {
max-width:700px;
}

div.entry-content a {
color: #BA3E3E;
font-weight: bold;
text-decoration: none;
border-bottom: 1px dotted;
}

div.entry-content a:hover {
color: #67A89B;
font-weight: bold;
text-decoration: none;
border-bottom: 1px dotted;
}

div.entry div.userpic {
float: right;
clear: left;
margin: 0 -140px 0 0;
width: 140px;
text-align: center;
}

div.entry div.userpic img {
padding: 4px;
margin-top: -30px;
margin-bottom: 2px;
border: 1px solid #D94848;
}

div.entry span.poster {
float: right;
clear: both;
text-align: center;
margin: 0 -139px 0 0;
font-size: 60%;
width: 138px;
color: #222;
}

div.entry span.poster a {
color: #F8F3EC;
font-weight: normal;
text-decoration: none;
}

div.entry span.poster img {
display: none;
}

div.entry div.metadata {
font-size: 80%;
margin: 0 0;
padding: 5px 7px 2px 5px; color: #4f4f4f; background-color:#fafafa;
}
div.entry div.metadata img {
	display: block;
	padding-right: 5px;
    }
div.entry div.metadata span.metadata-item {
color: #AF0000;
}
.entry .metadata-label {
        font-weight: bold; 
    }

div.entry div.metadata ul, div.entry div.metadata ul li {
margin-bottom: 0;
list-style: none; display: block; padding: 2px 0;
}

div.entry div.footer {
margin: 0 0;
padding: 0 0 10px 0;
background-color: #F8F3EC;
}

div.entry div.footer div.tag {
color: #4f4f4f; background-color:#fafafa;
font-size: 80%;
       font-weight: bold; 
margin: 0 0 0 0;
       padding: 2px 7px 7px 25px; 
}

.tag a {
        font-weight: normal;
        text-decoration: none;
        border-bottom: 1px dotted;
    }
    .tag ul { display: inline; margin: 0; padding: 0; }

.tag li { display: inline; list-style: none;  padding: 0px;
    }

ul.entry-management-links {
	margin: 0px 0px 10px 0px;
	padding: 10px 0px 0px 0px;
	list-style: none;
	text-align: center;
	border-top: 1px solid #D3DFA7;
	}

ul.entry-management-links li {
	margin: 0px auto;
	display: inline;
	list-style: none;
	text-align: center;
	}

ul.entry-interaction-links {
	padding: 0px;
	margin: 5px 0px 10px 0px;
	text-align: center;
	}

ul.entry-interaction-links li {
      display: inline;
      list-style: none;
      font-weight: bold;
      font-size: .9em;
      color:#333333;
      margin-left: 2px;
      padding: 2px 10px;
      text-transform: uppercase;
      background: #EEEEEE url(http://i.imgur.com/atVUl.png);
      border: 1px solid #DDDDDD;
      -moz-border-radius: 2px;
}

ul.entry-interaction-links li:hover {
      background: #EEEEEE
      url(http://i.imgur.com/atVUl.png);
      border: 1px solid #DDDDDD;
      border-top: 4px solid #C1272D;}

ul.entry-interaction-links a {
    color: #888888;
    text-shadow: 1px 1px 0 #FFF;
    }
ul.entry-interaction-links a:hover {
    color: #888888;
    text-shadow: 1px 1px 0 #FFF;
    }

li.entry-readlink,
ul.entry-interaction-links li.entry-readlink,
ul.entry-interaction-links li.readlink {
    display: inline;
    list-style: none;
    font-weight: bold;
    font-size: .9em;
    color: #FFFFFF;
    margin-left: 2px;
    text-transform: uppercase;
    padding: 2px 10px;
    background: #C1272D url(http://i.imgur.com/atVUl.png);
    text-shadow:-1px -1px 0 #111111;
    -moz-border-radius: 2px;
    border: 1px solid #9D090E;
    }

li.entry-readlink:hover,
ul.entry-interaction-links li.entry-readlink:hover,
ul.entry-interaction-links li.readlink:hover {
    color: #FFFFFF;
    background: #A30207 url(http://i.imgur.com/atVUl.png);
    border: 1px solid #760105;
    text-shadow:-1px -1px 0 #111111;
    }

ul.entry-interaction-links li.entry-readlink a {
    color: #FFFFFF;
    text-shadow:-1px -1px 0 #111111;
    }

li.active {
	list-style: none;
	display: inline;
	margin: 10px;
	}

/*COMMENTS*/

#comments {
width: 75%;
margin: 0 auto;
padding: 0;
}

div.comment {
background-color: #F8F3EC;
border-bottom: .25em #BA3E3E solid;
margin: 0;
padding: 0;
}

.comment-wrapper-even div.comment {
border-bottom: .25em #3D3E40 solid;
}

div.comment div.header {
margin: 0;
font-size: 80%;
background-color: #BA3E3E;
}

.comment-wrapper-even div.comment div.header {
background-color: #3D3E40;
color: #F8F3EC;
}

div.comment div.comment-title {
background-color: #9EBFB8;
}

div.comment div.comment-title h4 a {
padding: .25em .25em 0 .25em;
text-decoration: none;
font-weight: normal;
font-size: 110%;
color: #222;
}

div.comment span.datetime {
padding: .25em .25em 0 .25em;
margin: 0;
}

div.comment span.poster {
font-size: 80%;
}

div.comment span.poster-ip {
font-size: 80%;
color: #3D3E40;
}

div.comment div.contents {
padding: 0 0 0 .25em;
margin: 0;
}

div.comment div.contents a {
color: #BA3E3E;
font-weight: bold;
text-decoration: none;
border-bottom: 1px dotted;
}

div.comment div.contents a:hover {
color: #67A89B;
font-weight: bold;
text-decoration: none;
border-bottom: 1px dotted;
}

div.comment div.userpic {
float: right;
width: 76px;
text-align: center;
margin: .5em;
}

div.comment div.userpic img {
width: 70px;
height: 70px;
border: 3px #DBD5CC solid;
}

div.comment div.comment-content {
margin: 0;
padding: 1em 0 .5em .75em;
font-size: 95%;
}

div.comment div.footer {
margin: .5em 0;
clear: both;
padding: .5em .25em;
text-align: right;
font-size: 80%;
font-variant: small-caps;
}

ul.comment-management-links {
margin: 0;
text-align: center;
}

ul.comment-interaction-links {
margin: 0;
text-align: center;
}

/*NAVIGATION BOTTOM*/

.bottomcomment {
padding-bottom: 1em;
text-align: center;
}

.bottomcomment ul {
padding-bottom: .75em;
}

.bottomcomment ul a, .bottomcomment ul a:visited {
color: #3D3E40;
}

.bottomnav {
margin: 0 10% 0 0;
padding-bottom: .4em;
text-align: right;
}

/*REPLY PAGE*/

.page-reply .comment {
width: 75%;
margin: 0 2em;
border: 0;
background-color: #F8F3EC;
}

#qrform table { 
border: 0 !important;
}

table.talkform {
width: 75%;
border-top: .75em solid #BA3E3E;
border-bottom: .35em solid #BA3E3E;  
background-color: #F8F3EC; 
margin: 0 auto ; 
padding: 0 2em;
}

input, select, textarea {
border: 1px solid #BA3E3E;
background-color: #F8F3EC;
margin: 0px; 
padding: 0 0.15em;
}

/*BOTTOM MODULES*/

#tertiary .module {
float: right;
width: 24%;
margin: 0 0 1em 0;
}

#tertiary .module .module-content ul {
list-style-position: inside;
}

#tertiary .module-tags_cloud {
width: 48%;
}

#tertiary .module-tags_cloud .module-content {
text-align: justify;
margin: 0;
padding: 0 1.5em;
}

#tertiary .module-tags_cloud .module-content ul {
margin: 0;
padding: 0 1.5em 0 0;
}

#tertiary .module-tags_cloud .manage-tags-link {
text-align: right;
text-transform: uppercase;
margin-bottom: .75em;
}

#tertiary .module-active .module-content ul.module-list {
list-style-type: none;
list-style-position: outside;
}

#tertiary .module-time, #tertiary .module-powered, #tertiary .module-syndicate {
clear: both;
margin: 0 0 1em 0;
width: 95%;
}

#tertiary .module-syndicate .module-header {
display: none;
}

#tertiary .module-time .module-content, #tertiary .module-powered .module-content, #tertiary .module-syndicate .module-content {
text-align: right;
text-transform: uppercase;
font-size: 90%;
}

/*FOOTER*/

#footer {
text-align: center;
font-size: 80%;
text-transform: uppercase;
background-color: #2B1B05;
}

#footer a {
color: #ECE4DC;
}

/*ARCHIVE*/

.page-archive div.month {
margin: .25em auto 1.75em auto;
padding: 0;
width: 75%;
float: none;
margin: .25em auto 1.75em auto;
background-color: #F8F3EC;
}

.page-archive div.month h3 {
background-color: #3D3E40;
color: #F8F3EC;
padding: 0 .5em;
}

.page-archive div.month table { 
width: 75%; 
margin: 1em auto;
}

.page-archive div.month td {
border: 1px #D94848 solid;
}

.page-archive div.month th {
text-align: center; 
margin: 0 2px; 
font-weight: normal;
border: 1px #D94848 solid; 
}

.page-archive div.month td.day-has-entries p { 
padding: 0 0 0 5px; 
margin: 0; 
display: inline; 
}

.page-archive div.month div.footer {
text-align: right;
padding: .5em;
}

.page-month #archive-month { 
background-color: #F8F3EC;
width: 75%;
margin: 0 auto;
clear: both;
}

.page-month #archive-month > .inner {
margin: .5em 2em;
padding-top: .5em;
}

.page-month dt a {
font-size: 110%;
color: #4E4F52;
}

.page-month dd {
border-bottom: 1px dotted #DBD5CC;
margin-bottom: .75em;
}

.page-month .month div.tag {
margin-left: .75em;
font-size: 85%;
}

.page-day h3.day-date {
text-align: center;
}

/*TAGS PAGE*/

.page-tags .tags-container {
margin: 1em auto;
width: 75%;
padding: 0;
background-color: #F8F3EC;
}

.page-tags .tags-container h2 { 
padding: 0 .5em; 
margin: 0;
background-color: #BA3E3E;
color: #F8F3EC;
}

.page-tags .ljtaglist ul {
list-position: inside;
}

.page-tags .manage-tags-link {
text-align: right;
padding: 0 .5em .5em .5em;
}

/*LOCKED AND RESTRICTED ENTRIES*/

img[src*='locked.png'], img[src*='filtered.png'], img[src*='private.png'], img[src*='icon_18.png'], img[src*='icon_nsfw.png'] {
width: 0;
height: 0;
padding: 0 5px 18px 0;
}

.security-protected .entry .entry-title, img[src*='locked.png']{
padding-left: 20px;
background: transparent url('http://img217.imageshack.us/img217/5811/securityprotected.png') no-repeat center left;
}

.security-filtered .entry .entry-title, img[src*='filtered.png'] {
padding-left: 20px;
background: transparent url('http://img515.imageshack.us/img515/7246/securityfiltered.png') no-repeat center left;
}

.security-private .entry .entry-title, img[src*='private.png'] {
padding-left: 20px;
background: transparent url('http://img210.imageshack.us/img210/9441/securityprivate.png') no-repeat center left;
}

.restrictions-18 .entry .entry-title a, img[src*='icon_18.png'] {
padding-left: 20px;
background: transparent url('http://img221.imageshack.us/img221/5976/restricted18.png') no-repeat center left;
}

.restrictions-NSFW .entry .entry-title a, img[src*='icon_nsfw.png'] {
padding-left: 20px;
background: transparent url('http://img84.imageshack.us/img84/2337/restrictednsfw.png') no-repeat center left;
}

/*ICONS*/

img[src*='edit.png'] {
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img809.imageshack.us/img809/2171/editi.png') no-repeat;
}

img[src*='tag_edit.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img513.imageshack.us/img513/1378/tagsedit.png') no-repeat;
}

img[src*='memories_add.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img98.imageshack.us/img98/7530/addmemories.png') no-repeat;
}

img[src*='track.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img156.imageshack.us/img156/799/tracko.png') no-repeat;
}

img[src*='tellafriend.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img839.imageshack.us/img839/8812/tellafriend.png') no-repeat;
}

img[src*='next.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img137.imageshack.us/img137/6137/entrynext.png') no-repeat;
}

img[src*='previous.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img684.imageshack.us/img684/3527/entryprevious.png') no-repeat;
}

img[src*='anonymous.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img585.imageshack.us/img585/3443/anonymous.png') no-repeat;
}

img[src*='delete.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img263.imageshack.us/img263/5628/deleteqv.png') no-repeat;
}

img[src*='screen.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img3.imageshack.us/img3/9714/screenfk.png') no-repeat;
}

img[src*='unscreen.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img510.imageshack.us/img510/1627/unscreen.png') no-repeat; 
}

img[src*='freeze.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img641.imageshack.us/img641/1418/freeze.png') no-repeat;
}

img[src*='unfreeze.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img526.imageshack.us/img526/1844/unfreeze.png') no-repeat;
}

img[src*='subscription_add.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img121.imageshack.us/img121/3002/subscribeadd.png') no-repeat; 
}

img[src*='subscription_remove.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img704.imageshack.us/img704/8314/subscriberemove.png') no-repeat;
}

img[src*='access_grant.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img9.imageshack.us/img9/306/accessgrantn.png') no-repeat;
}

img[src*='access_remove.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img526.imageshack.us/img526/9239/accessremove.png') no-repeat; 
}

img[src*='community_join.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img405.imageshack.us/img405/5208/communityjoin.png') no-repeat;
}

img[src*='community_leave.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img121.imageshack.us/img121/6097/communityleave.png') no-repeat; 
}

img[src*='post.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img543.imageshack.us/img543/455/postoo.png') no-repeat; 
}

img[src*='message.png'] { 
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img190.imageshack.us/img190/7870/messageir.png') no-repeat;
}

img[src*='sticky_entry.png'] {
width: 0; height: 0; 
padding: 16px 18px 0 0; 
background: url('http://img137.imageshack.us/img137/4947/stickya.png') no-repeat; 
}

.ljuser img {
width: 0;
height: 0;
background-image: none;
padding: 0 0 16px 18px;
}

img[src*='user.png'] { 
width: 0; height: 0; 
padding: 0 0 16px 18px; 
background: url('http://img211.imageshack.us/img211/8576/userw.png') no-repeat; 
vertical-align: middle !important;
}

img[src*='user.png'], img[src*='lj-userinfo.gif'], img[src*='userinfo.gif'], img[src*='user_other.png'], img[src*='user_staff.png'], img[src*='.ico'] { 
background: url('http://img211.imageshack.us/img211/8576/userw.png') no-repeat bottom left;
padding: 0 0 16px 18px;
}

img[src*='community.png'], img[src*='community.gif'], img[src*='comm_staff.png'] { 
background: url('http://img571.imageshack.us/img571/5605/communitys.png') no-repeat bottom left;
padding: 0 0 16px 18px;
width: 0; height: 0;  
}

img[src*='openid.png'] {
background: url('http://img264.imageshack.us/img264/953/openid.png') no-repeat bottom left;
padding: 0 0 16px 18px;
width: 0; height: 0;
}

/*CONTEXTUAL POP-UP*/

div.ContextualPopup div.Inner { 
font-family: 'Lucida Grande', Helvetica, sans-serif;
background: #F8F3EC; 
border: 3px double #BA3E3E; 
color: #3D3E40; 
padding: 3px; 
text-transform: lowercase;
}

div.ContextualPopup .Content { 
padding: 1em;
}

div.ContextualPopup .Relation { 
margin-bottom: .8em;
}

div.ContextualPopup .Userpic { 
float: right; 
width: 50px; height: 50px; 
padding: 4px; 
border: 1px solid #D94848; 
margin-right: .5em;
}

div.ContextualPopup img { 
border: 0;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited { 
color: #4E4F52; 
font-weight: normal;
}

/*CONTROL STRIP*/

#lj_controlstrip {
background-color: #2B1B05;
background-image: none;
border-bottom: 0px dotted #BA3E3E;
}

#lj_controlstrip a {
font-family: 'Lucida Grande', Helvetica, sans-serif;
color: #9EBFB8;
}

#lj_controlstrip_statustext, #lj_controlstrip_actionlinks, #lj_controlstrip_search {
font-family: 'Lucida Grande', Helvetica, sans-serif !important;
color: #DBD5CC !important;
}

#lj_controlstrip_search input#search {
text-transform: none;
}

#lj_controlstrip_user,
#lj_controlstrip_login,
#lj_controlstrip_loggedout_userpic,
#lj_controlstrip_actionlinks
{
    border-right: 1px solid #3D3E40;
}

span.de, .info, .success, .warning, .error, .validation {
  border: 1px solid;
  margin: 25px 0px 5px 0px;
  padding:5px 10px 15px 50px;
  background-repeat: no-repeat;
  background-position: 10px center;
}
.info {
  color: #00529B;
  background-color: #BDE5F8;
  background-image: url('info.png');
}
.success {
  color: #4F8A10;
  background-color: #DFF2BF;
  background-image:url('success.png');
}
span.de, .warning {
  color: #9F6000;
  background-color: #FEEFB3;
  background-image: url('http://img141.imageshack.us/img141/351/warninga.png');
}
.error {
  color: #D8000C;
  background-color: #FFBABA;
  background-image: url('error.png');
}

(Fingers crossed!)

Flat | Top-Level Comments Only

From:

marahmarie

You are a genius, in this case. First of all, I hadn't meant to suggest floating as an option, I just got misinterpreted by the OP, and while the OP is right that floating *somewhat* fixes the problem, setting the display property to "block" makes it look much better than the float does (and negates the need for a float, while we're at it, since it centers the IP notice at the perfect width beneath the textarea). Awesome. :)

Edited Date: 2010-12-30 10:03 pm (UTC)

ninetydegrees

*g* Trial and error has made me realized that when dealing with SPANs you want to style as DIVs, display: block is often the better option.

Yeah; where it gets thorny is often where links are involved in the span; then I usually go with inline-block, myself, which was something I just kinda pulled out of my butt one night years ago, but it's done the trick a lot of times since. I'm really not sure if I have the span.de CSS on my journal block displayed or not, but I'll check now, since it seems to seriously prettify things. :)

Edit: Yeah, actually, I do have it block displayed:

.de{display:block; padding: 4px; width: 98%; border: 1px solid #c3c0ba; margin-top: 1em!important;font-size: 80%; background: #F3F5F2; color:#af230c;font-weight:bold; font-style:oblique;}

I've added so much code to the original layout I literally cannot recall all of it, but at least now that's cleared up. :)

Edited (more info) Date: 2010-12-30 10:25 pm (UTC)

I'm slowly getting used to using inline-block. It remains a bit of mysterious thing, though. :)

And it looks pretty! I've always thought this should be more emphasized than it is.

(I've subscribed to CSS code BTW; I'm probably going to need it soon; I have a style I have no idea how to code...)

Oh, thank you!

valiha

That is a really beautiful layout. Would you mind if I tried some of the code you used, to see what would work with my layout? And is there a big difference between using span.de vs. just .de?

Try away! No difference at all between span.de and .de, it's just less code to write. The only time you need to include the word span and the dot before the code is when the span is supplementary to it.

For instance, on LJ and DW, the CSS for our user icons is .ljuser, but there's also a span around them in many page views that you can style separately. In that case you would try something like span.ljuser {background: red}. If you just want to style the icon, then you'd leave off the span and write something like .ljuser {height: 13px}.

In other words (editing after realizing why this is confusing, and that my explanation was not terribly clear) in my example, .ljuser controls the user-icon image only, while span.ljuser can control the background for that image and the image itself, if you like. Hope that helps. :)

Edited (html flubs/clarity) Date: 2010-12-30 11:50 pm (UTC)

I just got misinterpreted by the OP

I seem to do that a lot lately. :)

I just replaced float with block, and you're right, it does look much better. I'll go read other replies now.

Dreamwidth style system discussion

Styling comments and notifications

Styling comments and notifications

no subject

no subject

no subject

no subject

no subject

no subject

no subject

no subject

Profile

April 2025

Links

Most Popular Tags

Page Summary

Style Credit

Expand Cut Tags