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

mario64mario

Sun Jul 13, 2008 10:02 am


PHP Coding difficulties

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

My background is overlapping the rest of my website, and I don't know how to fix that without taking out the background. I need the background to be...well...in the BACKGROUND. Can anyone help me? 

Here's my stylesheet (style.css)

/*
Theme Name: The Legend of Mario 1
Theme URI: http://beyondthelostwoods.net/
Description: The first of many layouts for 'The Legend of Mario' Layout designed by Kinopio.
Version: 1.0
Author: Mario64Mario
Author URI: http://smb.zeldaoracles.net/
*/

body {
margin: 0px;
padding: 0px;
text-align: center;
background-image: url(layout/bgpixel.png);
}

img {
border: 0px;
}

td.menu {
border-width: 1px;
border-top: 0px;
border-style: solid; 
border-color: #000; 
}

td.content {
border-width: 1px;
border-top: 0px;
border-style: solid; 
border-color: #000; 
}


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

btiffin

Sun Jul 13, 2008 12:07 pm


Re: PHP Coding difficulties

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

This isn't really a PHP issue.

When you set the body background, that influences the entire page.  You may want to move that CSS entry to one of your DIVs (if that is how you sectioned your page - I haven't looked) or even down to the  level for extra refinement.

Cheers
P.S. I only learn enough CSS to get the task at hand completed - then forget it.  But I think that is where your problem stems from.


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

mario64mario

Sun Jul 13, 2008 3:22 pm


Re: PHP Coding difficulties

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

Well I have two stylesheets: Style.css and Rtl.css. Should I get rid of one? 

My Stylesheet stems into nothing but images, and my RTL Stylesheet stems into: header.php, and footer.php.

Updated: I took out 'background-image: url(layout/bgpixel.jpeg);' from the Stylesheet, and the site remains the same.


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

Aziz

Sun Jul 13, 2008 3:42 pm


RE:PHP Coding difficulties

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

The latest defined rule overwrites the other ones (if they're the same rule, of course)


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

mario64mario

Sun Jul 13, 2008 4:58 pm


Re: PHP Coding difficulties

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

But it's a matter of bringing the background behind the rest of the content. everything else is there. -.-


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

rdrake

Sun Jul 13, 2008 8:52 pm


RE:PHP Coding difficulties

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

Moved to web design, not a PHP issue.


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

DemonWasp

Mon Jul 14, 2008 9:02 am


RE:PHP Coding difficulties

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

Assuming that I understand your problem, the solution is relatively simple. First, remember that all elements will default to having a transparent background, so you will be able to see the body background behind them.

Your HTML page is structured in terms of "containers" - each is inside another one, excepting the body, which is the "root" level container. So, the problem here is that you've got a background specified in the body, but there's nothing drawn over it. To fix this, you need to do something like:


td {
  background-color: #fff;
}


And you'd need a different one for each of td, div, and so forth. That will set their background to white, and you'll probably want to change that.


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

mario64mario

Mon Jul 14, 2008 9:38 am


Re: PHP Coding difficulties

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

So I insert the code you've given me, and replace the colour with the background file I have?


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

jeffgreco13

Mon Jul 14, 2008 9:57 am


Re: PHP Coding difficulties

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

No not at all...

You're background image IS in the background and there is NO WAY that it is overlapping tables on your site. (Unless you screwed up to code, so why dont u post some of it more than just the style)



td {
  background-color: #fff;
}


And you'd need a different one for each of td, div, and so forth. That will set their background to white, and you'll probably want to change that.


What he means is that would be one of the style attributes. notice the 'td' that means for each table cell it detects it will make the background colour white. if your body { } remains the same then the picture will still be ur background but will have white squares over it where the table cells are.


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

DemonWasp

Mon Jul 14, 2008 2:19 pm


RE:PHP Coding difficulties

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

There seems to be a slight misunderstanding going on here, about how HTML is rendered (and how styles are applied). Forgive me if I go over stuff you already know, I'm just making sure.

HTML has a block structure, meaning that each element has a beginning and an ending. The beginning is in the form  while the ending is in the form ; between them is the contents of that block.

Each of these blocks is rendered so that it contains anything that was between the start tag and the end tag.

When elements (such as tables, divs, spans, and so forth) draw, they will only draw parts that have been specified. If they contain text, then they will draw that text; if they have a border specified (as yours do), then they will draw the border. If they do NOT have a background given, then they won't draw a background, and there will instead just be a background showing through them.

This appears to be the problem you're describing: the background shows through the borders / text of your  and  elements. To prevent that from happening, you can just add the following to the top of your style.css file (warning: will set the background of most/all elements to be white):


table, div, span, p, h1, h2, h3, h4, h5 {
  background-color: #fff;
}


This will force those elements to draw a white background over their portion of the body background, so that the body background will NOT show through those elements.

If this is not the problem you're describing, then we will need some example code, or a screenshot - more information to help us understand what's going on.


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

mario64mario

Mon Jul 14, 2008 7:13 pm


Re: PHP Coding difficulties

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

I inserted it into my style.css, and the site is still the background colour. 

Let me explain how the design is set up. 

I have two stylesheets: 'style.css', and 'rtl.css'

From those two stylesheets, templates are called upon. The templates I have are as follows:

~ Single Post (single.php)
~ Widgets (widgets.php)
~ 404 template (404.php)
~ Comments Template (wp-comments.php)
~ Search Form (searchform.php)
~ Search Results (search.php)
~ Comments (comments.php)
~ Image Upload Template (image.php)
~ Header Template (header.php)
~ Footer Template (footer.php)
~ Index Template (index.php)

The three main templates I am assuming are involved in this problem are Header.php, Footer.php, and Index.php. Below, I will post the two style sheets, and the three templates.

Style.css

/*
Theme Name: The Legend of Mario 1
Theme URI: http://beyondthelostwoods.net/
Description: The first of many layouts for 'The Legend of Mario' Layout designed by Kinopio.
Version: 1.0
Author: Mario64Mario
Author URI: http://smb.zeldaoracles.net/
*/

table, div, span, p, h1, h2, h3, h4, h5 { 
  background-color: #fff; 
} 


body {
margin: 0px;
padding: 0px;
text-align: center;
}


img {
border: 0px;
}

td.menu {
border-width: 1px;
border-top: 0px;
border-style: solid; 
border-color: #000; 
}

td.content {
border-width: 1px;
border-top: 0px;
border-style: solid; 
border-color: #000; 
}

rtl.css

/*
Theme name: Legend of Mario 1 - The Beginning -
Editors: Mario64Mario; Kinopio
*/





body, .commentlist li, #commentform input, #commentform textarea, #commentform p, #sidebar, #wp-calendar caption  {
	font-family:tahoma, arial;
}


#page {
	text-align:right;
	direction:rtl;
}
h1, h2, h3, #sidebar h2 {
	font-family:arial, tahoma;
}
.commentlist li .avatar {
	float:left;
}
#header {
	margin:0 1px 0 0;
}
.narrowcolumn {
	float:right;
	padding: 0 45px 20px 0;
}
.widecolumn {
	margin: 5px 150px 0 0;
}
.widecolumn .smallattachment {
	margin: 5px 0 5px 5px;
}
.postmetadata {
	clear:right;
}
#sidebar {
	margin-left: 0;
	margin-right: 545px;
}
img.alignright {
	margin: 0 7px 2px 0;
}

img.alignleft {
	margin: 0 0 2px 7px;
}

.alignright {
	float: left;
}

.alignleft {
	float: right;
}
code {
	display:block;
	direction:ltr;
	text-align:left;
}
acronym, abbr, span.caps {
	letter-spacing:0;
}
html>body .entry ul {
	padding:0 10px 0 0;
	text-indent:10px;
}
html>body .entry li {
	margin: 7px 10px 8px 0;
}
.entry ol {
	padding: 0 35px 0 0;
}
#sidebar ul ul, #sidebar ul ol {
	margin: 5px 10px 0 0;
}
#sidebar ul ul ul, #sidebar ul ol {
	margin: 0 10px 0 0;
}
#commentform input {
	margin: 5px 0 1px 5px;
}
#commentform #submit {
	float:left;
}
.commentlist p {
	margin: 10px 0 10px 5px;
}
#wp-calendar #next a {
	padding-right:0;
	padding-left:10px;
	text-align:left;
}
#wp-calendar #prev a {
	padding-left:0;
	padding-right:10px;
	text-align:right;
}
blockquote {
	margin: 15px 10px 0 30px;
	padding-left: 0;
	padding-right: 20px;
	border-left: 0 none;
	border-right: 5px solid #ddd;
}
#email, #url {
	direction:ltr;
}

 !important;
    font:62.5%/125% 'Trebuchet MS', Tahoma, Arial, Helvetica, sans-serif;
    margin:0;
    padding:0;}



Header.php




The Legend of Mario






Footer.php