Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=32598" title="Pages that link to Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE (Page 1 of 1)" rel="nofollow" >Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE <span class="small">(Page 1 of 1)</span>\$

Caliburn Nervous Wreck (II) Inmate From: Las Vegas, NV Insane since: Sep 2009	posted 05-02-2012 13:11 Fellow inmates, It's been quite some time since I've posted here. I lurk quite often tho. I find myself running into a small little CSS3 wall that I cannot seem to overcome. I hope you guys can help me out a little bit. Here is the relevant CSS code: background-color: #550909; background-image: url("../imgs/bg.jpg"), url("../imgs/bg-bottomright.jpg"); background-position: left top, right bottom; background-repeat: no-repeat; Long story short... I have two background images I want to use. I want one in the top left and one on the bottom right. However the bottom right image is not going to the bottom! It's on the right side of the screen but will NOT go to the bottom right like I want it to! It's frustrating me. What am I doing wrong? I spent the last three hours going over a CSS3 book I have and I am not having any luck what-so-ever! Can you guys help me out? I have included a visual aid of the page. Please ignore the middle DIV background. Focus on the flowers on the right hand side. Lol. Also... I am testing this in Google Chrome! In theory it should be working. Image Example Of Problem: http://bayimg.com/haOMgaadF I have copy and pasted the actual HTML below although I highly doubt any of the HTML coding is causing the problem. Its fresh. But on the off chance... cause I am at a total loss... code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en-US" dir="ltr"><!-- Begin HTML Document --> <head><!-- Begin Header --> <title>The Lounge.</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="author" content="Dustin R. Sanchez"> <meta name="copyright" content="2012-2013 Dustin R. Sanchez"> <!-- Begin Lounge Specific CSS --> <link rel="stylesheet" type="text/css" href="styles/lounge.css" media="screen"> <!-- End Lounge Specific CSS; Begin Google Fonts CSS --> <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Tangerine"> <!-- FFSansSerif --> <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Alice"> <!-- FFSerif --> <!-- End Google Fonts CSS --> </head><!-- End Header --> <body><!-- Begin Main Body --> <div id="the_master"><!-- Begin Master Wrapper --> <div id="the_mistress"><!-- Begin Mistress Wrapper --> </div><!-- End Mistress Wrapper --> </div><!-- End Master Wrapper --> </body><!-- End Main Body --> </html><!-- End HTML Document -->
Tyberius Prime Maniac (V) Mad Scientist with Finglongers From: Germany Insane since: Sep 2001	posted 05-03-2012 11:07 Now, I have no clue about CSS3... have you tried simply reversing the images? This example: http://www.css3.info/preview/multiple-backgrounds/ works for me and it looks oh so similar to yours... I don't get it either
Caliburn Nervous Wreck (II) Inmate From: Las Vegas, NV Insane since: Sep 2009	posted 05-07-2012 05:02 I was able to resolve it. Why is this forum so damn slow? The Asylum used to be pretty busy. =(
Tyberius Prime Maniac (V) Mad Scientist with Finglongers From: Germany Insane since: Sep 2001	posted 05-07-2012 11:14 because we moved on with our lives . And back in the day, people would actually tell how they resolved it, not leave the next guy stuck...
Caliburn Nervous Wreck (II) Inmate From: Las Vegas, NV Insane since: Sep 2009	posted 05-08-2012 15:17 LOL fair enough Tyberius. It had to add the following to the CSS3: code: html, body { height: 100%; margin: 0%; padding: 0%; color: #fff; font: 60px 'Tangerine', sans-serif; } body { height: 100%; background-color: #550909; background-image: url("../imgs/bg.jpg"), url("../imgs/bg-bottomright.jpg"); background-position: left top, right bottom; background-repeat: no-repeat, no-repeat; margin: 0%; padding: 0%; text-align: center; } It was missing the "height: 100%;" part of the CSS. Anyhow does Doc even post anymore? Will the Ozone ever return to it's former glory? Will you ever re-code it? Haha.
Tao Maniac (V) Inmate From: The Pool Of Life Insane since: Nov 2003	posted 05-09-2012 03:20 quote: because we moved on with our lives Hmmm. Lives you say. I'll have to give that a try TP

Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=32598" title="Pages that link to Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE (Page 1 of 1)" rel="nofollow" >Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE <span class="small">(Page 1 of 1)</span>\$

Caliburn
Nervous Wreck (II) Inmate

From: Las Vegas, NV
Insane since: Sep 2009

posted 05-02-2012 13:11

Fellow inmates,

It's been quite some time since I've posted here. I lurk quite often tho. I find myself running into a small little CSS3 wall that I cannot seem to overcome. I hope you guys can help me out a little bit. Here is the relevant CSS

code:

background-color: #550909;
  background-image: url("../imgs/bg.jpg"), url("../imgs/bg-bottomright.jpg");
  background-position: left top, right bottom;
  background-repeat: no-repeat;

Long story short... I have two background images I want to use. I want one in the top left and one on the bottom right. However the bottom right image is not going to the bottom! It's on the right side of the screen but will NOT go to the bottom right like I want it to! It's frustrating me. What am I doing wrong? I spent the last three hours going over a CSS3 book I have and I am not having any luck what-so-ever! Can you guys help me out?

I have included a visual aid of the page. Please ignore the middle DIV background. Focus on the flowers on the right hand side. Lol. Also... I am testing this in Google Chrome! In theory it should be working.

Image Example Of Problem: http://bayimg.com/haOMgaadF

I have copy and pasted the actual HTML below although I highly doubt any of the HTML coding is causing the problem. Its fresh. But on the off chance... cause I am at a total loss...

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
			
<html lang="en-US" dir="ltr"><!-- Begin HTML Document -->
	<head><!-- Begin Header -->
	
		<title>The Lounge.</title>
		
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="author" content="Dustin R. Sanchez">
		<meta name="copyright" content="2012-2013 Dustin R. Sanchez">
		
		<!-- Begin Lounge Specific CSS -->
		<link rel="stylesheet" type="text/css" href="styles/lounge.css" media="screen">
		<!-- End Lounge Specific CSS; Begin Google Fonts CSS -->
		<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Tangerine"> <!-- FFSansSerif -->
		<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Alice"> <!-- FFSerif -->
		<!-- End Google Fonts CSS -->
		
	</head><!-- End Header -->
	
	<body><!-- Begin Main Body -->
		<div id="the_master"><!-- Begin Master Wrapper -->
	
			<div id="the_mistress"><!-- Begin Mistress Wrapper -->
			</div><!-- End Mistress Wrapper -->
	
		</div><!-- End Master Wrapper -->
	</body><!-- End Main Body -->
	
</html><!-- End HTML Document -->

Tyberius Prime
Maniac (V) Mad Scientist with Finglongers

From: Germany
Insane since: Sep 2001

posted 05-03-2012 11:07

Now, I have no clue about CSS3... have you tried simply reversing the images?

This example: http://www.css3.info/preview/multiple-backgrounds/ works for me and it looks oh so similar to yours...

I don't get it either

Caliburn
Nervous Wreck (II) Inmate

From: Las Vegas, NV
Insane since: Sep 2009

posted 05-07-2012 05:02

I was able to resolve it. Why is this forum so damn slow? The Asylum used to be pretty busy. =(

Tyberius Prime
Maniac (V) Mad Scientist with Finglongers

From: Germany
Insane since: Sep 2001

posted 05-07-2012 11:14

because we moved on with our lives .

And back in the day, people would actually tell how they resolved it, not leave the next guy stuck...

Caliburn
Nervous Wreck (II) Inmate

From: Las Vegas, NV
Insane since: Sep 2009

posted 05-08-2012 15:17

LOL fair enough Tyberius. It had to add the following to the CSS3:

code:

html, body {
	height: 100%;
	margin: 0%;
	padding: 0%;
	color: #fff;
	font: 60px 'Tangerine', sans-serif;
}

body {
	height: 100%;
	background-color: #550909;
	background-image: url("../imgs/bg.jpg"), url("../imgs/bg-bottomright.jpg");
	background-position: left top, right bottom;
	background-repeat: no-repeat, no-repeat;
	margin: 0%;
	padding: 0%;
	text-align: center;
}

It was missing the "height: 100%;" part of the CSS. Anyhow does Doc even post anymore? Will the Ozone ever return to it's former glory? Will you ever re-code it? Haha.

Tao
Maniac (V) Inmate

From: The Pool Of Life
Insane since: Nov 2003

posted 05-09-2012 03:20

quote:
because we moved on with our lives

Hmmm. Lives you say. I'll have to give that a try TP

Post Reply

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Loading...
Options:	Show Signature Enable Slimies Enable Linkwords

Topic: CSS3 Issue I am having - DRIVING ME BATSHIT INSANE (Page 1 of 1)

Insert Slimies »

Insert UBB Code »