Jump to content

page-bgbtm. Column on the side

- - - - -

  • Please log in to reply
12 replies to this topic

#1
_Metal_

_Metal_

    Newbie

  • Members
  • PipPip
  • 10 posts
Hello!

I am not a programmer or something like that but I'm trying to do a website.
I am using a template that I make changes in it. The language is css.

So my question is about this part:

#page-bgbtm {

	padding: 0px 50px 0px 50px;

}


/* Content */


#content {

	float: left;

	width: 530px;

	padding: 0px 0px 0px 0px;

	margin-bottom: 40px;

}


#content a, #sidebar a {

	

	text-transform: uppercase;

	font-size: 11px;

	font-weight: bold;

}

What does page-bgbtm stand for? Page-background ...?
And second, if this part is what I think it is, then it is like a column on the right side. But how can I make this column slimmer?


Please tell me if you dont understand what I mean.
Thank you.

#2
WingedPanther

WingedPanther

    A spammer's worst nightmare

  • Moderators
  • 16,831 posts
  • Location:Upstate, South Carolina
  • Programming Language:C, C++, PL/SQL, Delphi/Object Pascal, Pascal, Transact-SQL, Others
  • Learning:Java, C#, PHP, JavaScript, Lisp, Fortran, Haskell, Others
It's a class that can be defined on elements where you want that formatting to apply.
Programming is a branch of mathematics.
My CodeCall Blog | My Personal Blog

#3
_Metal_

_Metal_

    Newbie

  • Members
  • PipPip
  • 10 posts
sorry but I dont understand what you mean..

Can you please explain it a little further.

#4
Revolt

Revolt

    Programmer

  • Members
  • PipPipPip
  • 99 posts
I'd guess that stands for page background bottom.

That style is applied to an element with id 'page-bgbtm'. Probably a div. Check the html source and locate that element.

#5
_Metal_

_Metal_

    Newbie

  • Members
  • PipPip
  • 10 posts
But in this template I'm using there is a text column on the right side on page. I want to either remove it or make it slimmer. But I can't find it in the code.

This is all code for the website:


body {

	margin: 0;

	padding: 0;

	background: #000000;

	font-family: candara;

	font-size: 15px;

	color: #666;

}


h1, h2, h3 {

	margin: 0;

	padding: 0;

	font-weight: normal;

	color: #3E3530;

}


h1 {

	font-size: 2em;

	text-transform: uppercase;

	font-family: candara;

	font-weight: normal;

	color: #606060;

	padding: 12px 0px;


}


h2 {

	font-size: 1.8em;

	text-transform: uppercase;

	font-family: candara;

	font-weight: normal;

	padding: 8px 0px;

}


h3 {

	font-size: 1.4em;

	text-transform: uppercase;

	font-family: candara;

	font-weight: normal;

	padding: 5px 0px;

}


p, ul, ol {

	margin-top: 10;

	line-height: 180%;

}


ul, ol {

}


a {

	text-decoration: none;

	color: #339CCB;

}


a:hover {

	text-decoration: underline;

	color: #8A8A8A;

}


#wrapper {

	margin: 0 auto;

	padding: 0;

}


/* Header */


#header {

	width: 940px;

	margin: 0 auto;

}


#header img {

	width: 940px;

	margin: 0 auto;

	padding: 0;

	margin-left:12px;

}


#namn {

	width: 940px;

	height:  60px;

	margin: 0px auto;

	background: #000;

}

#namn h1 {

	text-transform: uppercase;

	font-family: candara;

	font-size: 30px; 

	font-weight: normal;

	color: #FFF;

	padding: 0px 25px;

	margin-top:10px;

}

#namn h2 {

	text-transform: uppercase;

	font-family: candara;

	font-size: 18px; 

	font-weight: normal;

	color: #FFF;

	padding: 0px 25px;

}




/* Nav */


#nav {

	width: 837px;

	height: 50px;

	margin: -3px auto;

	padding: 0px 40px;

	background: url(http://staticjw.com/n/templates/Flowermum/images/img01.jpg) no-repeat left top;

        list-style:none;


}


#nav ul {

	margin: 0;

	padding: 0;

	list-style: none;

	line-height: normal;

}


#nav li {

	float: left;

}


#nav a {

	height: 35px;

	display: block;

	float: left;

	margin: 0px 20px 0px 10px;

	padding: 15px 25px 0px 10px;

	text-decoration: none;

	text-align: centre;

	font-family: candara;

	font-size: 13px;

	font-weight: normal;

	color: #FFFFFF;

	border: none;

}


#nav a:hover {

	text-decoration: underline;

}


#nav #active a {

	font-weight: bold;

}


#nav .first a {

	padding-left: 0px;

}



/* Page */


#page {

	width: 917px;

	margin: 0 auto;

	padding: 0;

	background: url(http://staticjw.com/n/templates/Flowermum/images/img04.jpg) repeat-y left top;

}


#page-bgbtm {

	padding: 0px 50px 0px 50px;

}


/* Content */


#content {

	float: left;

	width: 530px;

	padding: 0px 0px 0px 0px;

	margin-bottom: 40px;

}


#content a, #sidebar a {

	

	text-transform: uppercase;

	font-size: 11px;

	font-weight: bold;

}


/* Sidebar */


#sidebar {

	float: right;

	width: 280px;

	margin: 0px;

	color: #666;

}


#sidebar ul {

	margin: 0;

	padding-left: 15px;

list-style: square;

}	


#sidebar li {

	margin: 0;

	padding: 0;

}


#sidebar li ul {

	margin: 0px 0px;

	padding-bottom: 30px;

}


#sidebar li li {

	background: url(http://staticjw.com/n/templates/Flowermum/images/img07.gif) no-repeat left 15px;

	margin: 0px;

	padding: 0px 0px 0px 20px;

	line-height: 35px;

	border-bottom: 1px dotted #E7E2DC;

}


#sidebar li li span {

	display: block;

	margin-top: -20px;

	padding: 0;

	font-size: 11px;

	font-style: candara;

}


#sidebar li li a {

	padding: 0px 0px 0px 0px;

}


#sidebar h4 {

	height: 15px;

	text-transform: uppercase;

	font-family: candara;

	font-size: 1.8em;

	font-weight: normal;

	color: #606060;

}


#sidebar p {

	margin: 0 0px;

	padding: 0px 0px 20px 0px;

	text-align: justify;

}


#sidebar a {

	border: none;

	color: #339CCB;

}


/* Footer */


#footer {

	height: 50px;

	margin: 0 auto;

	padding: 0px 0 15px 0;

	font-family: Arial, Helvetica, sans-serif;

}


#footer p {

	margin: 0;

	padding-top: 20px;

	line-height: normal;

	font-size: 10px;

	text-transform: uppercase;

	text-align: center;

	color: #A19D9A;

}


#footer a {

	color: #A19D9A;

}



/* images */

#content img {

	background: #fafafa;

   border: 1px solid #dcdcdc;

	padding: 10px;

}

img.float-right {

  	margin: 5px 0px 10px 10px;  

}

img.float-left {

  	margin: 5px 10px 10px 0px;

}


fieldset#contact-form {margin:20px 0px 20px 10px;padding:10px;color:#000;width:380px;background:#fafafa;border:2px solid #dcdcdc;}

fieldset#contact-form label {font-size:13px;}

fieldset#contact-form input {height:20px;font-size:15px;margin-bottom:15px;padding:3px;}

fieldset#contact-form textarea {font-size:15px;margin-bottom:15px;width:360px;padding:3px;}

fieldset#contact-form #contact-button {font-size:14px;height:30px;margin-left:30px;}

input:focus, textarea:focus {background:#fff;border:1px solid #555;}

blockquote {font-style:italic;}


#6
Revolt

Revolt

    Programmer

  • Members
  • PipPipPip
  • 99 posts
No that's only the CSS code of the website.

I'd imagine that text column on the side corresponds to the #sidebar id.

#7
_Metal_

_Metal_

    Newbie

  • Members
  • PipPip
  • 10 posts
But when I remove it nothing happens. The text is still there.. =(

#8
WingedPanther

WingedPanther

    A spammer's worst nightmare

  • Moderators
  • 16,831 posts
  • Location:Upstate, South Carolina
  • Programming Language:C, C++, PL/SQL, Delphi/Object Pascal, Pascal, Transact-SQL, Others
  • Learning:Java, C#, PHP, JavaScript, Lisp, Fortran, Haskell, Others
CSS controls how the HTML is displayed, not (in general) whether it is displayed.
Programming is a branch of mathematics.
My CodeCall Blog | My Personal Blog

#9
_Metal_

_Metal_

    Newbie

  • Members
  • PipPip
  • 10 posts
So you mean that the changes must be done in the html code?

#10
Revolt

Revolt

    Programmer

  • Members
  • PipPipPip
  • 99 posts
If you want to remove the text altogether the easiest way would be by just removing the text from the HTML. If you just want to reduce the size of that column you must find you the id or class of the div where the text is contained and change its width via CSS. To help you find the id of something in HTML you have lots of useful tools such as firebug for firefox, dragonfly for opera and others

#11
_Metal_

_Metal_

    Newbie

  • Members
  • PipPip
  • 10 posts
And the thing is that I can only make changes in the CSS code, not in the HTML. And I cant find anything that is called div or id in the CSS code. So is it possible to reduce the size of the column even though I can not make changes in the HTML?

#12
Revolt

Revolt

    Programmer

  • Members
  • PipPipPip
  • 99 posts
In order to know what to change in the CSS you have to take a look at the HTML code. You don't have to change it. Take a look at the page's HTML code and try to find the text that is in the sidebar. Then check the elements in which it is contained. One or more of them should have an id or class property. It is this id or class that is of interest to you so you can tell CSS what element to style.

Once again I repeat for clarity: the div elements and id properties appear in the HTML not the CSS




1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users