Changing the length of the line under the header

Mykle1

@cruunnerr

Or don’t use a header at all. My personal preference. :-)

cruunnerr

@Mykle1 said in Changing the length of the line under the header:

@cruunnerr

Or don’t use a header at all. My personal preference. :-)

Was just hoping there is an amazing trick to use the custom.css for exactly my problem XD

Maybe i simply shouldn’t install every module i find ^^

Mykle1

@cruunnerr said in Changing the length of the line under the header:

Maybe i simply shouldn’t install every module i find ^^

That’s exactly my point. Headers take up space. 3 or 4 headers take up the space of a small module.

doubleT

@cruunnerr said in Changing the length of the line under the header:

Was just hoping there is an amazing trick to use the custom.css for exactly my problem XD

There are a lot of amazing tricks. You can do this in custom.css:

header {
    border-bottom: none; /* instead of 1px solid #666; to remove all lines from all the headers */
    width: 50%;          /* add this to change the width of all module headers */
}
.middle header {
    /* addressing the header like this will only influence headers within the middle region */
}
#module_3_calendar header {
    /* only addresses the calendar header (find out the modules id before) */
}
.shoppinglist header {
    /* or use the class, which should be the module's name */
}

cruunnerr

That looks great !!!
Will try that later. Thank u very much dude :P

edit:

.left header {
    border-bottom: none;
}

THAT WORKS EXACTLY LIKE I WANT! Great :)

MadScientist

I have the same problem with the MMM-temp-ds18b20 module. I would like to remove the header and the underlying line but can’t get it to work. I am really lost as I have no idea how the css stuff works. Can you post your custom.css file and not just the very lines you changed? Is there a good guide for dummies (!!!)?

doubleT

In the config.js, when setting up the modules, leave the header fields empty. No line is shown when the header is empty.
EDIT:
header: "", that is …

MadScientist

I tried that already. But instead of no header I get “undefined” as a header.

doubleT

What I ment with hempty header was an empty string value for the header:

    header: "",

MadScientist

Ok, tried that but it said "undefined with the underline. I had previously removed the label for the senor. So setting

header: "",

and

label: "",

AND changing from x-stack to y-stack

displayMode: 'y-stack',

did the trick. Thanks for your help.

Is there a good place to learn about CSS? I tried figuring it out on my own but I just don’t understand how it’s done.