News:

Bored?  Looking to kill some time?  Want to chat with other SMF users?  Join us in IRC chat or Discord

Main Menu

Website was working now but now it only displays text.

Started by Elaine005, May 29, 2010, 08:11:03 PM

Previous topic - Next topic

Antechinus

This was nothing to do with css. I'll mark it solved.

Jakob Fel

I know, I have SMFForfree which has a replacement of themes. Instead of being programmed in PHP, it is programmed with CSS. It is more for me, since CSS is somewhat similar to JavaScript in terms of syntax. (May just be my opinion)
Freelance writer and advocate for security, privacy & DRM-free distribution
Support and Community Management at SMFNew Free Forum Hosting

MrPhil

Jake, I'm sorry, but what you said makes absolutely no sense.
QuoteInstead of being programmed in PHP, it is programmed with CSS.
Eh? The choice is "old style" HTML table-driven layout or CSS-driven positioning. Either way, you use PHP to generate the HTML on the fly. Nothing is ever "programmed" in CSS -- it's just fine tuning of position, size, color, etc. -- a listing of attributes.

Quotesince CSS is somewhat similar to JavaScript in terms of syntax.
Eh squared? CSS looks nothing like a programming language. It's just a list of attributes (settings). JS and PHP (and C) are more like each other in syntax.

Jakob Fel

Then what I was told isn't CSS. This is my current "CSS" code for my forum.


div.post A
{
           Color:#FFFFFF;
}
/* Normal, standard links. */
a:link
{
color: #FFFFFF;
text-decoration: none;
}
a:visited
{
color: #FFFFFF;
text-decoration: none;
}
a:hover
{
color: #FFFFFF;
text-decoration: underline;
}

/* Navigation links - for the link tree. */
.nav, .nav:link, .nav:visited
{
color: #FFFFFF;
text-decoration: none;
}
a.nav:hover
{
color: #FFFFFF;
text-decoration: underline;
}

/* Tables should show empty cells. */
table
{
empty-cells: show;
}

/* By default (td, body..) use verdana in black. */
body, td, th , tr
{
color: #d0d0d0;
font-size: small;
font-family: verdana, sans-serif;
}

/* The main body of the entire forum. */
body
{
background-color: #000033;
margin: auto;
padding: 12px 30px 4px 30px;



}

/* Input boxes - just a bit smaller than normal so they align well. */
input, textarea
{
font-size: 100%;
color: #d0d0d0;
background-color: #505050;
font-family: verdana, sans-serif;
}
button
{
background-color: ;
color: #000000;
font-family: verdana, sans-serif;
}

input, button
{
font-size: 90%;
}

textarea
{

font-size: 100%;
             background:  url();
             background-position: center center;
             background-repeat: repeat;
color: #d0d0d0;
background-color: #505050;
font-family: verdana, sans-serif;

}

/* All input elements that are checkboxes or radio buttons. */
input.check
{
}

/* Selects are a bit smaller, because it makes them look even better 8). */
select
{
font-size: 90%;
font-weight: normal;
color: #000000;
font-family: verdana, sans-serif;
}

/* Good Ole Horizontal Rule(s;).) */
hr, .hrcolor
{
height: 1px;
border: 0;
color: #000000;
background-color: #FFFFFF;
}

/* The Big Text */
h1
{
        background-color:#FFFFFF;
        background-repeat:repeat-x;
        padding:4px 15px;
        border: 1px solid #505050;
       
}

/* No image should have a border when linked */
a img
{
border: 0;
}

/* A quote, perhaps from another post. */
.quote
{
color: #036bc4;
background-color: #222222;
border: 1px solid #000000;
margin: 1px;
padding: 1px;
font-size: x-small;
line-height: 1.4em;
}

/* A code block - maybe even PHP ;). */
.code
{
color: #036bc4;
background-color: #222222;
font-size: x-small;
line-height: 1.3em;
/* Put a nice border around it. */
border: 1px solid #000000;
margin: 1px auto 1px auto;
padding: 1px;
width: 99%;
/* Don't wrap its contents, and show scrollbars. */
white-space: nowrap;
overflow: auto;
/* Stop after about 24 lines, and just show a scrollbar. */
max-height: 24em;
}

/* The "Quote:" and "Code:" header parts... */
.quoteheader, .codeheader
{
color: #036bc4;
background: url(http://www.styleyourforum.com/data/477/css1.gif) repeat-x;
text-decoration: none;
font-style: normal;
font-weight: bold;
font-size: x-small;
line-height: 1.2em;
        margin: 3px;
        margin-bottom: 6px;
        padding: 3px;
}

/* Generally, those [?] icons.  This makes your cursor a help icon. */
.help
{
cursor: help;
}

/* /me uses this a lot. (emote, try typing /me in a post.) */
.meaction
{
color: red;
}

/* The main post box - this makes it as wide as possible. */
.editor
{
width: 96%;
}

/* Highlighted text - such as search results. */
.highlight
{
background-color: yellow;
font-weight: bold;
color: black;
}

/* Alternating backgrounds for posts, and several other sections of the forum. */
.windowbg
{
color: #FFFFFF;
background-color: #000000;
}
.windowbg2
{
color: FFFFFF;
background-color: #000000;
}
.windowbg3
{
color: #FFFFFF;
background-color: #000000;
}

/* windowbg, windowbg2, windowbg3 link colors */
.windowbg a:link, .windowbg2 a:link, .windowbg3 a:link
{
color: #FFFFFF;
text-decoration: none;
}
.windowbg a:visited, .windowbg2 a:visited, .windowbg3 a:visited
{
color: #4F4F4F;
text-decoration: none;
}
.windowbg a:hover, .windowbg2 a:hover, .windowbg3 a:hover
{
             color: #796D50;
text-decoration: underline;
}

/* the today container in calendar */
.calendar_today
{
color: #000000;
             background-color: #FFFFFF;
}
/* These are used primarily for titles, but also for headers (the row that says what everything in the table

is.) */
.titlebg, tr.titlebg th, tr.titlebg td, .titlebg2, tr.titlebg2 th, tr.titlebg2 td
{
color: #FFFFFF;
font-style: normal;
             font-weight: bold;
background: url(http://www.styleyourforum.com/data/74/css2.png) #000000 repeat-x;
border-bottom: solid 1px #030306;
border-top: solid 1px #030306;
background-repeat: repeat-x;
padding-left: 10px;
padding-right: 10px;
}
.titlebg, .titlebg a:link, .titlebg a:visited
{
font-weight: bold;
color: #FFFFFF;
font-style: normal;
}

.titlebg a:hover
{
color: #FFFFFF;
}

.titlebg2
{
color: #FFFFFF;
}

/* same as titlebg, but used where bold text is not needed */
.titlebg2 a:link, .titlebg2 a:visited
{
color: #FFFFFF;
font-style: normal;
text-decoration: underline;
}

.titlebg2 a:hover
{
text-decoration: underline;
}

/* This is used for categories, page indexes, and several other areas in the forum.
.catbg and .catbg2 is for boardindex, while .catbg3 is for messageindex and display headers*/
.catbg , tr.catbg td , .catbg3 , tr.catbg3 td
{
background: url(http://www.styleyourforum.com/data/74/css2.png) #FFFFFF repeat-x;
color: #ffffff;
padding-left: 10px;
padding-right: 10px;
}
.catbg2 , tr.catbg2 td
{
background: url(http://www.styleyourforum.com/data/74/css3.png) #FFFFFF repeat-x;
color: #ffffff;
padding-left: 10px;
padding-right: 10px;
}
.catbg, .catbg2, .catbg3
{
border-bottom: solid 1px #1C1F32;
background-repeat: repeat-x;
}
.catbg, .catbg2
{
font-weight: bold;
}
.catbg3, tr.catbg3 td, .catbg3 a:link, .catbg3 a:visited
{
font-size: 95%;
color: white;
text-decoration: none;
}
.catbg a:link, .catbg a:visited , .catbg2 a:link, .catbg2 a:visited
{
color: white;
text-decoration: none;
}
.catbg a:hover, .catbg2 a:hover, .catbg3 a:hover
{
color: #FFFFFF;
}
/* This is used for tables that have a grid/border background color (such as the topic listing.) */
.bordercolor
{
            color: #FFFFFF;
background-color: #FFFFFF;
padding: 0px;
}

/* This is used on tables that should just have a border around them. */
.tborder
{
padding: 1px;
border: 1px solid #333333;
background-color: #333333;
}

/* Default font sizes: small (8pt), normal (10pt), and large (14pt). */
.smalltext
{
font-size: x-small;
font-family: verdana, sans-serif;
}
.middletext
{
font-size: 90%;
}
.normaltext
{
font-size: small;
}
.largetext
{
font-size: large;
}


/* Posts and personal messages displayed throughout the forum. */
.post, .personalmessage
{
width: 100%;
overflow: auto;
line-height: 1.3em;
}

/* All the signatures used in the forum.  If your forum users use Mozilla, Opera, or Safari, you might add max-height here ;). */
.signature
{
width: 100%;
overflow: auto;
padding-bottom: 3px;
line-height: 1.3em;
}

/* Sometimes there will be an error when you post */
.error
{
color: red;
}


/* definitions for the main tab, active means the tab reflects which page is displayed */
.maintab_first, .maintab_back, .maintab_last, .maintab_active_first, .maintab_active_back, .maintab_active_last
{
color: white;
text-transform: uppercase;
vertical-align: top;
}
.maintab_back, .maintab_active_back
{
color: white;
text-decoration: none;
font-size:  9px;
vertical-align: top;
padding: 2px 6px 6px 6px;
font-family: tahoma, sans-serif;
}

.maintab_first
{
background: url(http://www.styleyourforum.com/data/243/css5.png) left bottom no-repeat;
width: 10px;
}
.maintab_back
{
background: url(http://www.styleyourforum.com/data/243/css6.png) left bottom repeat-x;
}
.maintab_last
{
background: url(http://www.styleyourforum.com/data/243/css7.png) left bottom no-repeat;
width: 8px;
}
.maintab_active_first
{
background: url(http://www.styleyourforum.com/data/475/css7.png) left bottom no-repeat;
width: 6px;
}
.maintab_active_back
{
background: url(http://www.styleyourforum.com/data/475/css7.png) left bottom repeat-x;
}
.maintab_active_last
{
background: url(http://www.styleyourforum.com/data/475/css7.png) left bottom no-repeat;
width: 8px;
}

/* how links behave in main tab. */
.maintab_back a:link , .maintab_back a:visited, .maintab_active_back a:link , .maintab_active_back a:visited
{
color: white;
text-decoration: none;
}

.maintab_back a:hover, .maintab_active_back a:hover
{
color: #e0e0ff;
text-decoration: none;
}
/* definitions for the mirror tab */
.mirrortab_first, .mirrortab_back, .mirrortab_last, .mirrortab_active_first, .mirrortab_active_back, .mirrortab_active_last
{
color: white;
text-transform: uppercase;
vertical-align: top;
}
.mirrortab_back, .mirrortab_active_back
{
color: white;
text-decoration: none;
font-size: 9px;
vertical-align: bottom;
padding: 6px 6px 2px 6px;
font-family: tahoma, sans-serif;
}

.mirrortab_first
{
background: url(http://images.smfboards.com/Themes2/default/images/mirrortab_first.gif) no-repeat;
width: 10px;
}
.mirrortab_back
{
background: url(http://images.smfboards.com/Themes2/default/images/mirrortab_back.gif) repeat-x;
}
.mirrortab_last
{
background: url(http://images.smfboards.com/Themes2/default/images/mirrortab_last.gif) no-repeat;
width: 6px;
}
.mirrortab_active_first
{
background: url(http://images.smfboards.com/Themes2/default/images/mirrortab_active_first.gif) no-repeat;
width: 6px;
}
.mirrortab_active_back
{
background: url(http://images.smfboards.com/Themes2/default/images/mirrortab_active_back.gif) repeat-x;
}
.mirrortab_active_last
{
background: url(http://images.smfboards.com/Themes2/default/images/mirrortab_active_last.gif) no-repeat;
width: 8px;
}

/* how links behave in mirror tab. */
.mirrortab_back a:link , .mirrortab_back a:visited, .mirrortab_active_back a:link , .mirrortab_active_back a:visited
{
color: white;
text-decoration: none;
}

.mirrortab_back a:hover, .mirrortab_active_back a:hover
{
color: #e0e0ff;
text-decoration: none;
}

/* The AJAX notifier */
#ajax_in_progress
{
background: #32CD32;
color: white;
text-align: center;
font-weight: bold;
font-size: 18pt;
padding: 3px;
width: 100%;
position: fixed;
top: 0;
left: 0;
}
Freelance writer and advocate for security, privacy & DRM-free distribution
Support and Community Management at SMFNew Free Forum Hosting

MrPhil

Yes, that's CSS. As you can see, it looks nothing like any programming language. It's just a list of attributes (settings) to apply to various named things (elements, ids, classes) in the HTML. No flow control, no testing, no variables,... it's basically a configuration file.

Jakob Fel

True, but I thought it looked a little like a programming language, more than settings. Maybe that's just me, being used to config and .ini files instead. I am mainly an offline software kind of guy, and I am just now getting into web development.
Freelance writer and advocate for security, privacy & DRM-free distribution
Support and Community Management at SMFNew Free Forum Hosting

Advertisement: