The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Background HTML Help
drkdreamgurl
post Sep 2 2006, 08:31 PM
Post #1





Group: Members
Posts: 5
Joined: 2-September 06
Member No.: 54



This is my problem. I have a fixed image, and a background image repeating to cover the full screen. I can make the background image repeat vertically down the whole length of the page, but it repeats on the right side as well, and I can't figure out or find any codes to help me to not have it do that. Does this make sense, so someone can help me out so that my background doesn't repeat towards the right as well?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Liam Quinn
post Sep 2 2006, 10:59 PM
Post #2


WDG Founder
***

Group: Root Admin
Posts: 52
Joined: 2-August 06
From: Canada
Member No.: 1



See http://www.htmlhelp.com/faq/html/images.html#no-repeat-bg. If you want it to repeat vertically but not horizontally, use repeat-y in place of no-repeat.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
drkdreamgurl
post Sep 3 2006, 06:01 AM
Post #3





Group: Members
Posts: 5
Joined: 2-September 06
Member No.: 54



That did nothing but kill my image background completely. Now it doesn't show up at all.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 3 2006, 06:19 AM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Then you did something wrong. If you post the URL to the page we can help you figure out what went wrong. smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
drkdreamgurl
post Sep 3 2006, 12:12 PM
Post #5





Group: Members
Posts: 5
Joined: 2-September 06
Member No.: 54



Okay, just the site, or the HTML code I have so far? Here's the site:

http://neopets.com/guilds/guild.phtml?id=2343112

But you'll have to be signed in to Neopets to see it. If you'd rather I pasted the whole code, I can.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
John Pozadzides
post Sep 3 2006, 01:35 PM
Post #6


WDG Founder
******

Group: Root Admin
Posts: 529
Joined: 3-August 06
From: Magnolia, TX
Member No.: 2



Why don't you go ahead and paste the code instead. I don't think anyone is going to log in to look at it...

You can use the [ html ] and [\ html ] BB Codes to paste your code into the forums. Just remove the spaces between the brackets and HTML.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
drkdreamgurl
post Sep 3 2006, 03:27 PM
Post #7





Group: Members
Posts: 5
Joined: 2-September 06
Member No.: 54



HTML
<head>
<style>
.head { background-color: E4D4AC;letter-spacing: 1px; text-align: center}
body, td, font, p, i {color: #000000; font:7pt Tahoma;cursor:default ;}
A {color:#cc0066; font:7pt tahoma; text-decoration:none;}
A:hover {font-size: 7pt;font-family:tahoma;font color: margin: 1px; style: solid;}
font, td, p, i, xmp, u{font-family:tahoma;font-size:7pt;font-weight:normal;line-height:7pt;font-style:normal}
b{color:#746C43;font-family:tahoma;}
img{
filter:alpha(Opacity=0,FinishOpacity=0,Style=0,StartX=0,FinishX=0, StartY=0,FinishY=0)
}p img{
filter:chroma(color= )
}TABLE{
background:none}TD{background:none
}
#object, #input, #select {border: 2px dashed #E4D4AC}
#input, textarea, #form, #option, #select{
border: 1px solid #E4D4AC;font-size: 7pt;font-family: verdana; background-color:#C9A556;
color:#826732; margin: 1px; style: solid;}
clsid:D27CDB6E-AE6D-11cf-96B8-444553540000, classid, #ban, #object,#n{display:none}
</style>

</head>

<body background="http://img.photobucket.com/albums/v675/lastangelinheaven/Guildlayouts/desertbottomlayout.jpg">

<IMG SRC="http://img.photobucket.com/albums/v675/lastangelinheaven/Guildlayouts/desertfullpagelayouttop.jpg" style="position:absolute; left:0; top:0" width="798" height="373">
<div style="position: absolute; left: 316; top: 313; z-index: 2; width: 284; height: 377">
<center><b>NEWS</b><br>
<br>
NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS NEWS
<p align="center"><br>

<b>Council</b><br>
<br>
COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL COUNCIL
<p align="center"><br>
<br>
<br>
<b>Sub-Council</b><br>
<br>
SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL SUB-COUNCIL <br>
<br>
</div>

<div style="position: absolute; left: 621; top: 313; z-index: 2; width: 123; height: 383">

<b>Links</b><br>
<br>
LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS LINKS <br>
<br>
<b>Extra Info</b><br>
<br>
EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA EXTRA <br>
<br>
</div>

<div style="overflow: auto; position: absolute; left: 139; top: 300; z-index: 2; width: 149; height: 39">
<font color="red"><a href="http://neopets.com/addpet.phtml">Create a Pet</a><br><a href="http://neopets.com/petcentral.phtml">Pet Central</a><br><a href="http://neopets.com/explore.phtml">Explore</a> <br><a href="http://neopets.com/gameroom.phtml">Games</a> <br><a href="http://neopets.com/neomessages.phtml">Neomail</a><br> <a href="http://neopets.com/objects.phtml">Shops</a> <br><a href="http://neopets.com/neoboards/index.phtml">Neoboards</a> <br><a href="http://neopets.com/nf.phtml">News</a><br> <a href="http://neopets.com/stuff.phtml">Stuff</a> <br><a href="http://neopets.com/help.phtml">Help</a> <br><a href="http://neopets.com/loginpage.phtml">Login</a> <br><a href="http://neopets.com/">Logout</a>
</font color>
</div>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 3 2006, 03:41 PM
Post #8


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



I don't see that you try to do it? Anyway, remove the background from the body tag and add this to your style sheet.

body { background: #abc123 url(http://img.photobucket.com/albums/v675/lastangelinheaven/Guildlayouts/desertbottomlayout.jpg) repeat-y }

Replace #abc123 with the background color you want.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 3 2006, 04:02 PM
Post #9


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



There are a number of errors in the embedded style sheet, most of them can probably be pointed out by this tool: http://htmlhelp.com/tools/csscheck/ however, note that the CSS-checker will not allow the MSIE filter effects, and at least one of these looks broken:

CODE
p img{
filter:chroma(color= )
}


I advice against using inline styles. Also they contain errors not found by the validators (the dimension values need units):

CODE
    <div style="position: absolute; left: 316; top: 313; z-index: 2; width: 284; height: 377">
    
    <div style="overflow: auto; position: absolute; left: 139; top: 300; z-index: 2; width: 149; height: 39">


I also recommend that you fix the errors reported by the HTML validator: http://htmlhelp.com/tools/validator/direct.html.en
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
drkdreamgurl
post Sep 4 2006, 11:22 AM
Post #10





Group: Members
Posts: 5
Joined: 2-September 06
Member No.: 54



Thanks so much to everyone for the help, I appreciate it lots. I got looking properly now, thanks!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 4 2006, 11:29 AM
Post #11


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Welcome. smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 29th March 2024 - 05:35 AM