wireframe1colwnews basic template

[evoke28]

I was just wondering has anyone used the wireframe1colwnews template. this is my site www.deadmonkeyrecords.com. i have everything set up except for the content and the look.

i am trying to change the menu colour and banner colour. when i go in to the CSS and change something it does nothing to the site. Has anyone messed around with this template.

also do the # sign mean commented out.

thanks for any help

[Dr.CSS]

I use one of the wire frame templates as the base for every template I make...

What are you trying to do?...

The # and div# mean the id of the item, say the main div is ,  a  . means class as in   .class

You can get rid of the JS style sheet and the niftycorners style sheet, they are for round corners...

Same thing with the JS turned on...

http://multiintech.com/index.php/rounde ... mages.html

[evoke28]

thanks for the reply.that is areally cool site. bookmarked that.

i just turned on the JSlayout1col CSS by uncommenting the text inside it. I would like to have my website with rounded corners.

i looked in the CSS but it looks to me that all the text in it is uncommented so it should be working. when you download the template does it come with certain CSS off. if you get what i am saying. how do i turn them on.

thanks for the help

[Dr.CSS]

OK in the template you find...




Remove the part marked in red...

For CSS unattach...wireframe1colwnews : wframeLayout1col and the border style sheet then uncomment the JS one...

[evoke28]

thanks for the help.that worked perfectly.

Had to comment out the borders text in the borders CSS cause it was overlapping the round boxes.

thanks again

[evoke28]

just one more question. I have looked in all the CSS and cannot find where the colours are for the different boxes. when i changed the background colour to red nearly all the boxes inherited red. you can see it on my site  www.deadmonkeyrecords.com.

in what CSS can you control the background colour of banner or are they set to inherit what the background colour is.

thanks

[Dr.CSS]

To get the corners right you have to change the JS here...

/uploads/wireframe1colwnews/1collayout.js

window.onload=function(){
if(!NiftyCheck())
    return;
Rounded("div#header","all","#f2f2f2","#f2f2f2","border #000");
Rounded("div#content","all","#f2f2f2","#f2f2f2","border #000");
Rounded("div#menu_horiz","all","#f2f2f2","#f2f2f2","border #000");
Rounded("div#contenthead","all","#f2f2f2","#f2f2f2","border #000");
Rounded("div#mainblock","all","#f2f2f2","#FFF","border #000");
Rounded("div#footer","all","#f2f2f2","#f2f2f2","border #333");
}

You can do diff. corners, "all" means all corners, using, tl = top left, tr, bl = bottom left, br, top, bottom, and any combo of these with a space between, "tr bl"...

These are all the divs you can/might want to add a background color to but you can do any you want...

If I recall correctly the first is the out side the second is inside, if it is an image use transparent, if you don't want borders just delete ,"border #***" and add ,"smooth"

[evoke28]

ok did that. it worked for the corners  but the it did not change the whole box.just the lines. changing the main block of text colour is easy too find but i cannot find the others.

here the new website  www.deadmonkeyrecords.com.you can see what i am talking about/

thanks

[Dr.CSS]

Try this CSS, it's reformatted to be easier to see/use...

Which part do you want to add background-color: to?... (hint)

/* SITE SPECIFIC LAYOUT */
html {
height: 100%;
margin-bottom: 1px
}
html, body {
margin: 0;
padding: 10px 0 20px
}
div#box {
width: 1000px;
margin: 0px auto
}
/*changes the with of the website*/
div#page {
width: 100%;
margin: 0px;
text-align: left
}
div#header {
width: 100%;
margin: 0px auto;
padding: 10px 0;
}
div#hbox {
margin: 0;
padding: 10px
}
* html body div#hbox {
margin: 0;
padding: 10px 0
}
div#header h1 {
margin: 5px 0;
padding: 60px 5px 15px
}
div#menu_horiz {
width: 95%;
margin: 3px auto;
padding: 0px
}
/*width  is 95% of the website*/
div#wrapper {
height: 20px;
padding:  0
}
div#menuwrapper {
margin: 0px;
padding: 0px 0 0 0px
}
/*changes the width of the menu*/
div.breadcrumbs {
margin: 0;
padding-left: 10px;
text-align: left;
font-size: 90%;
}
div#contenthead {
width: 90%;
height: 20px;
margin: 3px auto;
padding: 10px 0;
}
* html body div#contenthead {
margin: 0px auto;
padding: 10px 0;
}
div#content {
margin: 4px 0 10px;
padding: 0px
}
div#contentbox {
margin: 0px;
padding: 10px
}
* html body div#contentbox {
margin: 0px;
padding: 10px
}
div#contentbox table {
margin-left: 25px
}
div#contentbox th {
padding: 7px
}
div#contentbox th h2 {
font-size: 170%;
color: #000
}
p.center {
margin: 0px;
text-align: center
}
.center {
margin-left: 180px
}
div#footer {
clear: both;
margin-top: 10px
}
div#footer p {
margin: 0;
padding: 0px;
text-align: center;
}
div#mainblock {
height: 100%;
width: 100%;
margin: 0 0 10px;
padding: 0px
}
* html body div#mainblock {
width: 100%;
margin: 0px;
padding: 0px
}
div#mainblock.col {
height: 100%;
width: 77%;
margin: 0 0 10px;
padding: 0px
}
div#main {
padding: 5px 0;
}
* html body div#main {
padding: 5px;
}
div#block2 {
width: 73%;
margin: 0 0 10px;
padding: 0
}
* html body div#block2 {
width: 73%;
margin: 10px 0px;
padding: 0px
}
div#content2 {
padding: 5px;
margin: 0px;
}
divmain p {
margin: 0px;
padding: 5px;
display: inline
}
div#content2 h2 {
margin: 0px;
padding: 5px;
}
div#newsblock {
float: right;
width: 20%;
margin: 20px 10px;
display: inline;
}
div#newsblock.tsw {
float: right;
width: 20%;
margin: 5px 10px;
display: inline;
}
div#news {
padding: 0 8px;
}
/* commented these out because they mees up the web site*/
/*div#flat {
clear: both;
width: 66%;
height: 38px;
margin: 10px 0 0;
padding: 0px;
}
div.top49 {
float: right;
width: 45%;
text-align: right;
}
div.left49 {
float: left
}
div.right49 {
float: right
}
div.left49 a {
display: block;
height: 36px;
width: 53px;
margin: 0px;
padding: 0px;
}
div.right49 a {
display: block;
height: 36px;
width: 53px;
margin: 0px;
padding: 0px;
}
div.left49 a:hover {
width: 53px;
height: 36px;
background: url(uploads/wireframe1colwnews/backw.png);
}
div.right49 a:hover {
width: 53px;
height: 36px;
background: url(uploads/wireframe1colwnews/forw.png);
}
*/

[evoke28]

how did you get my code. they are all the comments that i put in. That is amazing

[evoke28]

sorry about that did not cop on. really sorry about wasting your time. got it now. thanks a million for your help