Jump to content

Search the Community

Showing results for tags 'background'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH


  • Community Calendar




Website URL








Found 33 results

  1. This is my little site. So the problem is this: Why is the background picture (the one in middle with its frame, you will notice if you check through IE8 and firefox) not visible in IE8 but its all ok in Firefow browser? The link: http://chrisport.zxq.net/ The css code is included in the hmtl file as one can see.
  2. What I want is a image as a background-and then place divs on that same background I use wrapper ^^
  3. Hi, I'm relatively new to CSS, and have been trying to learn to use some of the newer CSS3 features recently. I've been trying to get an effect looking similar to lens vignetting around the edges of a web page and decided to try using the "box-shadow: inset [etc...]" property to do so.However, for some reason when I apply this to my "body" in CSS, the effect does not extend to the bottom of the page. Instead, it seems to be constrained to the extent of the padding around the body element. The only reason I thought it would make sense to add the box-shadow to the body in the first place was because I assumed the body applied to the whole page (I reasoned that if the background-image tiles an image infinitely, regardless of how long the page becomes, the same would apply to the box-shadow property). Obviously, putting the box-shadow on the body was the wrong decision; I'm just wondering how best to get an inset box-shadow to consitently cover all four edges of the frame of the web page and stick/scale with the page to fit different window sizes. The existing method I used does all of that except extend to the bottom edge of the page. Here's the body div in question: body {background-image:url('bg-pattern.png');padding: 4em;margin: auto;font-family: Arial, Helvetica, sans-serif;font-size:100%;color: rgb(215,215,215);box-shadow: inset 0px 0px 250px 0px black;-webkit-box-shadow: inset 0px 0px 250px 0px black;-moz-box-shadow: inset 0px 0px 250px 0px black;background-color: #333333;height: 100%;} And I've attached an image of the problem as well.
  4. I have been using Positioning and Float to set up a banner. I want to have a fixed height banner (starting at the top of the page) and for this to have: an image located on the left; a background (generated from an img); and a single line of text aligned to the right of it and at the bottom. The html has a div with an id. This div contains the img and that has a class which floats it to the left. This div also contains the text, which is aligned to the right. The external CSS style sheet details the id, which repeats a background img to fill the browser window [repeat-x (doesn't seem to matter if I specify left/right/center)], and the class which floats the image [img.floatLeft], Main Problem: It works, but I can't figure out how to get the line of text, which is happily sitting on the right, to be at the bottom of the div. Isn't align deprecated? I'm confused. Secondary Issue; I read about the CSS background-position Property. I would like to fix the banner at the top of the page independent of scrolling, But I can't make it work with the repeated background image. I also noticed that the size of the image used for the repeat is changed when the div is fixed. I'm viewing it in FF 9.0.1. Thanks in advance.for any help / suggestions
  5. Hi! I'm new here, and I'm very new to CSS so I'm sorry if I ask silly questions! I've been working on making a website for a new business, and even though only the 'Coming Soon' page is up, it still demonstrates my problems. http://www.youmightlikethis-music.com I tried to use CSS to make sure the background image fits to whatever size the screen is, but on big screens it is too short, and on smaller screens if you scroll down there is a white bar which I can't get rid of. If someone could help me with this I'd be very appreciative! Thank youu
  6. Background Texture Color Advice

    So Im working on the background of my website trying to mesh colors and such... however I have run into troubles and need a small bit of advice if possible.. http://ezeshops.com/ is my website, for reference. How do the pros out there pick colors for the background that match, is there a tool to make the textured background to the color you want, and what colors would you recommend for my site. 2nd ... I have a div for the header a div for the footer, and a body background.... is there a way to move that header background up slightly so its halfway in the menu without screwing up my shadow effects? Im guessing absolute positioning but figured id ask first The biggest issue is the colors though, I stink at art and cant find a color combo that looks good that have a background texture that meshes well. Thanks.
  7. body {margin: 0;padding: 0;background: #FF9FFF;} div#header {background: center no-repeat url(xxx.png);height: 300px;width: 100%;} div#wrapper {width: 1280px;margin: 0 auto;background: #FFF;} /*div#footer {margin: 0 auto;width: inherit;height: 250px;position: relative;clear: both;}*/ div#menu {margin: 0;width: inherit;height: 40px;background-color: #FF99CC;}div#menu ul {margin: 0;padding: 0;line-height: 40px;} div#menu li {margin: 0;padding: 0;list-style: none;float: right;position: relative;}div#menu ul li a {text-align: center;height: 40px;width: 200px;display: block; color: #FFFFFF;text-decoration: none;text-shadow: 1px 1px 1px #000;}div#menu li:hover {background: #FFFF66;}div#menu ul li a:hover {color: #FF0099}#flashContent { width:100%; height:100%; } <div id="header"></div><div id="wrapper"><div id="content"><div id="menu"><ul> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=""></a></li> <li><a href=""></a></li></ul></div> </div><!--<div id="footer"><img src="" /></div>--></div> How can I make my header image of 1280px*200px extend to the full width of a page in different resolutions without repeating?Like this site: http://www.noobcube.com/tutorials/html-css/fixed-header-footer-layout-a-beginners-guide-/ But my header image is a gradient one and I cannot set the header background-color as a gradient one so I get stuck at this.Is there a CSS fix for this problem?
  8. Jquery Multiple Animations = Lag

    Hey guys! Btw, great new look Okay, I have a problem that I fear cannot be resolved.I would simply like confirmation of this. My site makes use of jQuery and the LavaLamp effet for the menu.You can check it out here. My problem is this: the portfolio section is basically a jQuery slideshow, with fading transitions and such.We're still good. The problem comes when I add an animation the the background image.The slideshow becomes choppy whenever the user moves his mouse. Am I coding in a non-efficent way?Or is this just a normal jQuery limitation? Thanks.