|
HTML - Data Cell Background Images Are Repeating
I would like to put an image as a background image in a data cell to prevent unauthorized copying (or help prevent thereof). However, when I do this the image begins to repeat itself if the data cell is slightly larger than the image specs.
The images are located here at www.gabegarcia.com All images on the left side of the pages is what I would like to make background images without the repeat. What would I have to add to accomplish this? Similar TutorialsAs the title says: Is it possible to repeat an image horizontally that is not a background image? Thank you! I am trying to have a non repeating background in my table. My table is inside a DIV tag. It works perfect in Mozilla Firefox but not in internet explorer. I know someone on this forum had a similar problem awhile ago but I couldn't seem to fix my problem. I am not the best at coding. This is what I have <table width="800" border="0" align="center" cellpadding="0" cellspacing="0" style="background:url(assets/blob2.png)no-repeat"> Any help would be greatly appreciated Hi there, I'm having a problem with an HTML newsletter. There is a Left Column that is supposed to have a background image that repeats as often as the content on the right demands. Anything you could suggest would be amazing. Here is my code: HTML Code: <style type="text/css">
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
line-height:125%;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
}
#container {
width: 600px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
background: #FFFFFF;
margin: auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
#leftColumn {
width: 165px;
height: 100%;
float:left;
background-image: url(http://www.research.legalaid.on.ca/images/BLsidegrey.gif);
}
#footer {
font-size: 12px;
line-height: 125%;
color: #996600;
background-color: #E9F4F5;
border: 1px solid #CCCCCC;
width: 590px;
float:right;
padding-left:10px;
}
#mainContent {
width: 435px;
float: right;
background-color:#FFFFFF;
}
#textBox {
padding-left: 10px;
}
.thisIssue{
font-weight:bold;
color: #cc6600;
line-height: 125%;
}
.date{
font-weight:bold;
color: #333333;
line-height: 135%;
}
.authors{
font-weight:bold;
color: #333333;
line-height:90%;
}
</style>
</head>
<body class="oneColFixCtr">
<div id="container">
<img src="http://www.research.legalaid.on.ca/images/BL_fam.gif" border="0" alt="Mainheader" align="middle" />
<div id="leftColumn"></div>
<div id="mainContent">
<div id="textBox">
<p><span class="thisIssue">This Issue</span><br/>
<!-- TemplateBeginEditable name="Date" --><span class="date">March 28, 2012</span><!-- TemplateEndEditable --><br/>
<!-- TemplateBeginEditable name="Authors" --><span class="authors">by: Elizabeth Ramsden</span><!-- TemplateEndEditable --></span>
</p>
<!-- Top Divider -->
<img style="padding-bottom:5px" src="http://www.research.legalaid.on.ca/images/divider.gif" alt="topDivider" border=0 /><br/>
<!-- Main Content Goes Here -->
<!-- TemplateBeginEditable name="MainContent" -->
<p> </p>
<!-- TemplateEndEditable -->
<p>
<!-- Main Content Ends Here -->
<!-- Bottom Divider -->
<IMG style="padding-top:10px" src="http://www.research.legalaid.on.ca/images/dividerbottom.gif" alt="bottomDivider" border=0><br/>
</p>
</div><!-- end #textBox -->
</div><!-- end #mainContent -->
Hello, I am using a template to make a webpage. The background for one of the cells is not covering the entire area. I have looked and looked at this and can not figure it out. Therefore I thought I would ask some pros. Thanks!! Okay, here's what I've got: two nested tables next to each other, both with two cells in them. The bottom cell on the left table is just a filler, and has a background image to complete the layout of the site -- however, since there's no content in it, it doesn't show up. Giving it a set pixel height makes it show up, but I can't do this, as the content in the other table changes. So, I need this cell (the bottom one on the left) to automatically size itself to whatever the other table is. A height="100%" attribute also doesn't work... Help? Thanks. :] Hi everyone, I was wondering whether I can add an alt attribute to a table cell background image. I tried to add it in the code after the image address, but it doesn't work. Is there another way? Thanks! I am having trouble getting an image to line up in a cell so that the text aligns left and the image directly to the right of it to match the other cells. http://smartvending.com/testindex.html Can anyone see what is wrong with the code that is preventing the Coin Counters & Sorters gray box from allowing anything to align closer to the right side of the box matching the other cells? Any help is greatly appreciated! Thanks Hi I want to addd a image for background so i can postion it and not have it repeat : for for a table cell if u see my link below its the purple table cell that has the Bomboniere Adelaide as the heading i only want the background image in that cell - thanks in advance http://weddingsmadeeasy.com.au/adelaide/Bomboniere.html Hi, How can I set a background gradient for a cell in a table? (i.e., start colour:#222222; end colour:#000000) The size of the cell may vary so a tiled image wouldn't work. Thanks. OK I am so new to HTML I can't even spell it. I have a industrial HMI the has some custom webpage features to it and I would like to learn how to build the attached Table. I am not looking for someone to do this for me I am looking for some pointers. Here is a link to the device that I am going to use and a quick breakdown of how they do things. This statement that I fully understand, I am out of my knowledge base so that is why I am here "Although the HTML code will be explained or commented through this document, a basic understanding is required to create a proper web site." http://www.redlion.net/Support/TechN...ace/TNOI33.pdf I don't know what CSS is ? I got a few examples from all over the web some from http://www.quackit.com. and just can't figure out the layout and cell colors. I plan on changing the background color on the cell to the right of the descriptor depending on the cell value. Red if <100, Green >100 I would like to start with a cell layout that I can then link values to and from the HMI per the instructions in the Tech Note above. I have played with this device just basically copy and paste the above note I have gotten that working before. Thanks for taking your time to at least read this post from a NOOB. Hello all, First time posting to the forums here. I'm creating a table and each row represents a "tab" of the UI. Each cell has a background image that looksl ike this. however, when I render my table and have text in the cell, the right edge of the tab is chopped off like this.. Any recommendations on some CSS or table attributes that I can aplly to make both rounded ends of the background image appear? I've tried turning off table borders, cell spacing and cell padding. Any help would be greatly appreciated. Thanks. Hello, I am new to these forums, and I greet you all Here is the problem I am having. I have a 3x3 table, and I want to use the 6 bottom cells to display linkable pictures of merchandise. I want the cells to display a different picture each time the customer visits the website. I found a javascript for diaplying a random, linkable, picture each time someone visits, but the problem is you can't put the script in each cell. It conflicts with itself somehow. The pictures rotate, but the links only go to the last set of links in the last cell. What is the best method I can use to accomplish my goal? Or can the script below be edited in such a way as to be useable in each cell? Thanks! Code: <script language="javascript">
/*
Random image slideshow- By Tyler Clarke (EMAIL REMOVED - Send PM to This User Instead)
For this script and more, visit http://www.javascriptkit.com
*/
var delay=0 //set delay in miliseconds
var curindex=0
var randomimages=new Array()
randomimages[0]=["picturehere.jpg","linkhere"];
randomimages[1]=["picturehere.jpg","linkhere"];
randomimages[2]=["picturehere.jpg","linkhere"];
randomimages[3]=["picturehere.jpg","linkhere"];
var preload=new Array()
for (n=0;n<randomimages.length;n++)
{
preload[n]=new Image()
preload[n].src=randomimages[n]
}
var First=Math.floor(Math.random()*(randomimages.length));
var LnkURL=randomimages[First][1];
document.write('<img onclick="Link();" name="defaultimage" src="'+randomimages[First][0]+'">')
function Link(){
if (LnkURL){
window.location=LnkURL;
}
}
function rotateimage()
{
if (curindex==(tempindex=Math.floor(Math.random()*(randomimages.length)))){
curindex=curindex==0? 1 : curindex-1
}
else
curindex=tempindex
LnkURL=randomimages[curindex][1];
document.images.defaultimage.src=randomimages[curindex][0];
}
setInterval("rotateimage()",delay)
</script>
So I decided to see if I could make my site XHTML 1.0 Strict-compliant. Here's the main page on my test server I'd be thrilled with it if I could do 3 things: - Set the background color of the left column to match the color behind the fonts. Is there a CSS class I can create and set the cells to that class? - Remove the border around clickable images. - Get the spacing between the menu options on the left to look the way it does on the other pages in the site. If you click any of the pages on my actual site you can see the look I'm going for. Thanks as always for the help! Joshua Hi everyone: Any help appreciated. Objective: To have three equally sized and spaced images arranged horizontally, with their size set automatically by the size of the window. Development: I'm using a Mac, and I don't have ready access to a PC to experiment. What I tried: Code: <table> <tr> <td><img src = "a.png" style = "width: 100%" /></td> <td><img src = "b.png" style = "width: 100%" /></td> <td><img src = "c.png" style = "width: 100%" /></td> </tr> </table> <p class = "caption">A caption for the 3 images</p> <p class = "legend" >A legend for the three images</p> What happened: This works perfectly in Safari and Firefox (Mac) and Firefox under Vista, but in Internet Explorer under Vista , the images are HUGE - the unscaled size of the originals. What I think is the reason: IE is taking 100% to be relative to the width of the body element, not the td element. What I don't want to have to do: Use fixed sizes or calculate the sizes on the fly. What I'm trying now: removing the table and using a div, and inside that, setting the image width to 33% and floating one right and one left. What's the trick to get around this IE "gotcha" please? Thanks from a newbie. I'm trying to put a background on my website Im using Wordpad I put the code in but it's coming up as a image not as a background. <body BACKGROUND="...."> Am i using the rong code? Hi, I'm trying to put some background images into my web page. But in this case I don't wan't them to cover all the background, nor to repeat themselves. I wan't different images as a backgrond. One would be the head banner at the top, the other one would be the image as background of the index and navigation bar at the left and the other image would be the one that serves as background to the site's content to the right. I need to know how to align this images into the exact position I need them to be, and how to upload this images. I used this code: TD width=160 background="imagename" border="0"" height=345></TD> however, it doesn't takes it as a background but as an image and it pushes the text down instead of being behind. So, please if someone could explain me about this I would be very grateful. Thanks a lot. Hi, this is probably an easy question, but I'm a complete html newb so here goes: I want to put an image on my nevada refinance website of a house or something and then set it into the background so I can overlay a form for submitting your zipcode to get free mortgage quotes. I've found suggestions for setting a background image for the whole page, but I don't want to do that, just put an image on the page and set it into the background to the text box goes over the top. Can someone give me a little advice on how to do this? I just wanted to know if we can put 2 background images in the same webpage ? The first 200 pixels (height) should have one image and the rest of the webpage should have another image. Is this possible in anyway ? Thnx in Advance I have an 8 year old website with 99.9% valid HTML4.01 transitional code. The only problem I'm having is that the attribute "BACKGROUND" in my tables is not recognized as valid. I need to use images as backgrounds in some of my tables. Is there any way I can do this with HTML, or maybe an in line style sheet? I'm not at all familiar with CSS so I'm hoping that there is another way. Thanks. Hey All Groovie forum you got here Ok, now to my main point... I want to be able to stretch a image (banner) fully across the screen. I dont want to adjust the height, just make it run from one to side to the other. Also how do I stretch the background image to fullscreen without css? Cheers |
|||||||