my "style" - need css-help

Hi,

i took the default-style, copied someting from other Styles etc., deleted something and now i have i this.

I like to read the Messages in Headline-Mode. Every Message has two lines: the first is for the author, the second the Headline. But after this there are one or two empty Lines. How can i delete these lines? I have absolutly no idea, my css-skills are very bad.

Greets,
Mic

-------------

xcen > de [click to translate]

body {
background: #fafcff;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 10px;
margin: 0;
padding: 0;
}

/* ---------------------- Header ---------------------- */

#header {
background: #314a59 url('chrome://brief/skin/header-bkg.png') repeat-x;
color: #ffffff;
text-decoration: none;
display: block;
padding: 5px 5% 5px;
overflow: auto; /* Clears contained floats */
}

#feed-image {
border: none;
float: right;
margin: 0 10px 10px;
}

#feed-title {
font-size: 20px;
font-weight: bold;
}

#feed-subtitle {
font-size: 13px;
margin-top: 3px;
}

#feed-content {
margin: 20px auto 0;
padding: 0 10px 10px;
max-width: 80em;
}

#message {
font-size: 20px;
color: #4a6e85;
text-align: center;
display: none;
margin-top: 100px;
}

/* --------------------------- Article ------------------------ */

/* .article-container may have "starred", "read", and "collapsed"
attributes. The first two are self-explanatory while "collapsed"
means that the article's content is folded (headlines-only mode) */
.article-container {
background: url('chrome://brief/skin/unread-entry-bkg.png') repeat-x;
background-color: #ffffff;
border-top: 1px #abbfc9 solid;
border-right: 1px #e1e5da solid;
border-left: 1px #e1e5da solid;
padding-bottom: 1px; /* Without this, the article is sometimes cut-off */
overflow: visible; /* This is for the the expand/collapse dropmarker which is
taken outside the box using negative margins */
position: relative;
}

/* ---------------------- Article header ---------------------- */

.article-header {
min-height: 3.5em;
padding: 6px 5px 0 0;
}

.article-title-link {
color: #00394f;
font-size: 13px;
font-weight: bold;
text-decoration: none;
}

/* ---------------------- Article controls ---------------------- */

.article-controls {
font-family: Arial, sans-serif;
font-size: 12px;
display: table-cell; /* The only way I could find out to keep the buttons aligned
was to use vertical-align. For this we need table-cell. */
float: right;
margin-top: -5px;
}

/* Never change padding of the buttons as it would break many themes */
.article-controls > button {
opacity: 0.8;
min-width: 0;
vertical-align: middle;
}

.article-controls > button:hover {
opacity: 1.0;
}

.star-container {
float: left;
margin: -6px 2px 0 0;
width: 24px;
height: 3.0em;
}

.star-image {
padding: 5px 0 0 5px;
}

.expand-button {
display: none;
position: absolute;
top: 0;
left: -35px;
height: 6em;
width: 42px;
}

/* ---------------------- Article subheader ---------------------- */

.article-subheader {
font-family: "Lucida Grande", Verdana, sans-serif;
color: #477900;
font-size: 12px;
padding: 0 25px 0 40px;
overflow: auto; /* Clears contained floats */
}

.article-authors, .article-date {
text-align: right;
float: right;
}

.article-authors {
margin-top: 2px;
clear: right;
}

.article-updated {
color: #de5b00;
}

/* ---------------------- Article content area ---------------------- */

.article-content {
font-family: "Lucida Grande", Verdana, sans-serif;
font-size: 12px;
line-height: 1.4;
color: #272727;
margin-top: 15px;
padding: 0 25px 35px;
overflow: auto;
}

.article-content a {
color: #0a1f72;
}

.article-content a:visited {
color: #444b66;
}

/* ---------------------- Adjustments for read articles ---------------------- */

.article-container[read] {
background-image: url('chrome://brief/skin/read-entry-bkg.png');
}

.article-container[read] > .article-header > .article-title-link {
font-weight: normal;
}

/* ---------------------- Adjustments for headlines view ---------------------- */

.article-container[collapsed] {
background: #fafcff;
border-bottom: none;
border-right: none;
border-left: none;
clear: both;
margin-bottom: 0;
padding: 0 1px 1px 1px; /* Compensate the lack of border, so it doesn't shift */
}

.article-container[collapsed] .article-controls,
.article-container[collapsed] .article-content {
display: none;
}

.article-container[collapsed]:hover .article-controls {
display: none;
}

.expand-button {
display: none !important;
}

/* ---------------------- Adjustments for the selected articles -------------------- */

.article-container[selected] {
border-top-color: #1474d6;
border-right-color: #1474d6;
border-left-color: #1474d6;
}

/* Non-selected articles don't have bottom border, so if we added one now the article
would shift. Therefore, we change the top border color of the NEXT article. */
.article-container[selected] + .article-container {
border-top-color: #1474d6;
}

.article-container[selected]:last-child {
border-bottom: 1px solid #1474d6;
}

Re: my "style" - need css-help

I like to read the Messages in Headline-Mode. Every Message has two lines: the first is for the author, the second the Headline. But after this there are one or two empty Lines. How can i delete these lines?

I don't understand, could you please explain your issue again? I've applied you style and I don't see the author displayed in headlines view. Perhaps a screenshot would help.

ancestor,
creator of Brief

Re: my "style" - need css-help

ok, sorry, my english is very bad. I took two screenshots now.

The first from the "unread"-Mode:
http://www.abload.de/img/screenshot-25-neutbd.png

The second from the "Feed"-Mode:
http://www.abload.de/img/screenshot-26-neuneg.png

At both there are blank lines after the Headlines - they're red. How can i delete them? They are a waste of space.

Greets
Mic

Re: my "style" - need css-help

Here's the most likely reason:

.expand-button {
  height: 6em;
}

Try decreasing the height. Other elements with hard-coded height are .star-container and .article-header.

Re: my "style" - need css-help

yes, i found that before, but did not find the right settings.

Now i set

.article-header {
min-height: 1em;

and

.expand-button {
height: 1em;

and it looks good.
But only in the "Show unread messages"-view:
http://www.abload.de/img/screenshot-27sx3.png

The "Feed-only"-view looks like this:
http://www.abload.de/img/screenshot-28-neu7hn.png

How can i minimize this "new" space (marked red) between the messages?

Re: my "style" - need css-help

Specify

margin: #;
in the article-container. You can set the margin number (#) by px or em.

Re: my "style" - need css-help

i tried with 1em, 5em, 10em, 1px, 5px, 100px....but i absolutely don't know how to minimze the space...that doesn't work... ?

Re: my "style" - need css-help

If that doesn't work, then another area of the CSS is conflicting with the coding I told you try.

margin in article-container specifies the amount of space that will be between each feed item's article container.

Re: my "style" - need css-help

any other idea?

The following from the minimal-style minimizes the space when i set height to 1em:

.expand-button {
display: none;
float: left;
height: 1em;
margin: -4px 0 0 -36px;
width: 35px;
}

But i cannot copy it into my style because it does not work. Something of the other code is annoying.
I tried many times, but cannot find out the right code section. It's horrible :(