|
HTML - Html Image Rotator Not Displaying Correct Image On Slide
Hey guys. I need a little help with my HTML image rotator.
Everything works fine, except the images don't show up on the right slide. All 4 images show up on the first slide. I can't figure out what's wrong. Any help will be greatly appreciated. Code: <!DOCTYPE html>
<html>
<head>
<title>...</title>
<style>
#sliderwrap {
height: 403px;
}
#sliderleft {
width: 10px;
height: 100%;
float: left;
background: #efefef;
border: 1px solid #ccc;
}
#sliderleft div {
height: 100px;
border-bottom: 1px solid black;
}
#slidercontent {
position: relative;
width: 650px;
height: 100%;
float: left;
border: 1px solid black;
overflow: hidden;
}
#sliderimages {
position: absolute;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
#sliderimages img {
display: block;
}
.s0 #slide0,
.s1 #slide1,
.s2 #slide2,
.s3 #slide3 {
background: #ccc;
}
.s0 #sliderimages {top: 0 }
.s1 #sliderimages {top: -500px}
.s2 #sliderimages {top: -1000px}
.s3 #sliderimages {top: -1500px}
</style>
<script>
var slide = 0;
var interval_id = 0;
function stop_timer() {
clearInterval(interval_id);
if (this.getAttribute("data-slide")) {
slide = parseInt(this.getAttribute("data-slide"));
document.getElementById("sliderwrap").className = "s" + slide;
}
}
function start_timer() {
clearInterval(interval_id);
interval_id = setInterval(
function() {
slide = (slide + 1) % 4;
document.getElementById("sliderwrap").className = "s" + slide;
},
3000
);
}
window.onload = function() {
start_timer();
var el = document.getElementById("slidercontent");
var divs = document.getElementById("sliderleft").getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) {
divs[i].onmouseover = stop_timer;
divs[i].onmouseout = start_timer;
}
el.onmouseover = stop_timer;
el.onmouseout = start_timer;
}
</script>
</head>
<body>
<div id="sliderwrap" class="s0">
<div id="sliderleft">
<div id="slide0" data-slide="0"></div>
<div id="slide1" data-slide="1"></div>
<div id="slide2" data-slide="2"></div>
<div id="slide3" data-slide="3"></div>
</div>
<div id="slidercontent">
<div id="sliderimages">
<img src="http://i.imgur.com/8iWz6.jpg">
<img src="http://i.imgur.com/1d2U6.jpg">
<img src="http://i.imgur.com/8iWz6.jpg">
<img src="http://i.imgur.com/1d2U6.jpg">
</div>
</div>
<div style="clear: both;"></div>
</div>
</body>
</html>
Similar TutorialsHey guys, I'm building a website.... www.allseasuns.com. I want the first picture on the page to rotate buutttttttttttttttt to no avail it's not working. Thanks in advance for everything. Hi all, I would like to display the left 2/3rds of an image, and then immediately pan to the right to switch the view to the right hand side 2/3rds of that image. How can I do this? I've tried the marquee keyword, but that starts with a blank space then slides in the whole image. I want to start with the left 2/3rds then pan to the right 2/3rds then stop. See here for an example: http://www.pinecrestmaine.com/gorham.htm Any ideas how this is done? Thanks, Sandi I want to have multiple banners appear every couple seconds like a slide show. Here is my website. (http://www.dubcityfilms.com) The banner is the one with the cars on it. I want to have 5 or so different ones that randomly switch. Can someone help me with this? Thanks. Hi, I'm building a web site for someone. At the top of the page is the logo and some flowing lines going from left to right on screen. If you look he http://www.chrisvanochten.com/clients/voicecontrol/ and start resizing your browser window then you would see the content at the bottom moves along so that it is always in the center. The problem I have is that the image on the top will not do this. This is because it's a background image. I want the image to be positioned so that the logo is above the latest news section. I have tried using a normal image and aligning it to the center (scroll down on the page above for this) but the image is always anchored to the left of the screen if the image is larger than the browser window. Is there anyway to set the background image so that it is anchored in position and that it will run off both the left and right hand side of the screen (as opposed to just the right hand side)? With the align attribute of <img> deprecated, can anyone tell me what the correct way of center-aligning an image should be? Thanks, James Hello, I'm using Kubuntu Linux. My Website is warp.net16.net Here is the coding that I used to try and put my image up, as you can see it is not showing. <H1 ALIGN=CENTER><U>W.A.R.P</U></H1> <P ALIGN=CENTER>(Work, Assisted, Resource, Program)</P> <P ALIGN=CENTER> <img src="file:///home/esprit/My Website/images/chokurei_spiritmatter.jpeg"/> </P> Thank you for your time and help, I really appreciate it. Hi the website is showing up fine but there should be a repeater background image , and it doesnt show up in browser at all . Been working on it for 4 hours now. Please help me.. website link: http://extramoney.net16.net/instructions.html What do you need to fix ? Html code ? Image name: repeater.jpg and it is uploaded to hosting space . Thanks in advance for answers , Michael Hi! I've been working with html for a couple of years, but working with XML, C#, ASP.Net for the past three months and I may be exhausted, but for the life of me I cannot see why the image is not displaying for this page. See code below: <table width="100%" border="0"> <tr> <td align="center"><font face="Times, Arial, Helvetica"><a href="picLHVSMFP.htm" target="main"><img src="../images/picSHVSMFP.jpg" width="324" height="500" alt="Harmony Village - Sheppard - Main Floor Plan" border="0"> </a></font></td> </tr> <tr> <td> </td> </tr> <tr> <td align="center"><font color="#000000">Harmony Village - Sheppard - Main Floor Plan</font></td> </tr> <tr> <td> </td> </tr> <tr> <td align="center"><a href="picHVSFP4.htm"><img src="../images/rightarrow.gif" width="11" height="10" border="0"></a> <font color="#003333"><a href="future.htm">Future Projects</a></font> <a href="picHVSFP2.htm"><img src="../images/leftarrow.gif" width="11" height="10" border="0"></a> </td> </tr> </table> I have underlined and bolded the image that is not displaying. The other images on the page are displaying and the links work and I have triple-checked the spelling and opened the image with Adobe Photoshop multiple times. I have even tried decreasing the image size, although larger images have displayed on the website without problems. Is there a syntax problem that I am just not seeing? I have attached the image as well. Thanks!!! Hi. I have a question regarding my site. If you click on the link using IE you will see that the images in my tables are cut off on the right, and haven't been scaled at all... In Google Chrome they appear fine. Here is the HTML code snippet: Code: <table>
<tbody>
-snip-
<table>
<tr>
<td>
<div class="large">
<a href="http://picasaweb.google.com/lh/photo/QnqiMcSvmlR_osQplmz-Iw?authkey=Gv1sRgCNbCzI295-KBIg&feat=directlink" target="_blank">
<img class="large" src="http://lh3.ggpht.com/_lPPWxJaDX_0/S1tmkLXjmBI/AAAAAAAAAVA/782xI-SkNVQ/s640/step1-2.jpg" alt="CashCrate offers page." title="CashCrate offers page.">
</img>
</a>
</div>
</td>
</tr>
</table>
-snip-
</tbody>
</table>
And here is some css code: Code: div.large {
width: 100%;
height: 200px;
border: none;
margin-top:6px;
margin-bottom:6px;
overflow: auto;
}
img.large {
width: 98%;
height-max: 600px;
padding: 2px;
border: ridge;
border-color: #66E066;
}
I'm wanting to know what I need to add/change to make the images appear right in all browsers(I've only tested in IE and Chrome). If you need any more info about my page, ask . Thanks. Hello all, I am not understanding the coding for the relative path for my image from the index.html page. I have an image which I gave the name "jesus.jpg" and this image is located in my pc in the folders c://mike'sdocs/websites/church/churchimages/jesus.jpg The index.html file is in the "church" folder and the image itself "jesus.jpg" is in the "churchimages" folder. so the code I am using is <img src="churchimages/jesus.jpg" /> but it does not show in Firefox's browser, help please? I tried other images in that same folder but same result, what could be wrong here please? I've had a few different problems with this page. In an earlier version, I had the bottom content contained in a div called 'bottom'; however, in IE this created an unwanted gap between the two top divs and the bottom one that I couldn't figure out how to get rid of. So I tried something else, and I thought I had it figured out. This layout works well enough in FF ((still needs a bit of work, but nothing I don't already know how to do, just haven't gotten to it yet)), but it displays weird in IE. I know that adding the proper doctype fixes the problem, but I don't have that option. The webhost I have to work with isn't the best, and thus I need a way to make this display properly in quirks mode in IE. My problem is the image that appears on it's own row in the middle of the page, it should be in the same row as the two images directly below it. Here's my code: Code:
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title>Berean Baptist Church</title>
<style type="text/css">
#all{
width: 755px;
}
img{
border: 0px;
}
a.default:hover{
cursor: default;
}
#D_1091040261286 {
display: none;
}
#firstright{
float: right;
height: 230px;
width: 240px;
}
#firstleft{
float: left;
height: 230px;
width: 504px;
}
#bottom{
text-align: center;
height: 560px;
width: 762px;
}
#tablist{
padding: 0px 0px 3px 0px;
margin-top: 5px;
margin-left: 1px;
font: bold 10px Verdana;
}
.buttons{
font: bold 10px Verdana;
}
#tablist li{
list-style: none;
display: inline;
margin: 0;
}
#tablist li a{
color: white;
text-decoration: none;
padding: 3px;
margin-left: 0px;
border: 1px solid black;
background-color: #69090A;
}
#tablist li a:hover{
color: #b1272a;
background-color: #efefd1;
cursor: pointer;
}
#linkboxes {
background-color: transparent;
border: 1px solid black;
}
#linkboxes td {
border: 1px solid;
}
#beforeyouattend a {
background: url(/images/10000/3000/914BE/user/beforeyouattend.gif);
display: block;
width: 220px;
height: 28px;
}
#beforeyouattend a:hover {
background: url(/images/10000/3000/914BE/user/beforeyouattendhover.gif);
display: block;
width: 220px;
height: 28px;
}
#weeklybulletin a {
background: url(/images/10000/3000/914BE/user/weeklybulletin.gif);
display: block;
width: 220px;
height: 28px;
}
#weeklybulletin a:hover {
background: url(/images/10000/3000/914BE/user/weeklybulletinhover.gif);
display: block;
width: 220px;
height: 28px;
}
#volunteeropportunities a {
background: url(/images/10000/3000/914BE/user/volunteeropportunities.gif);
display: block;
width: 220px;
height: 28px;
}
#volunteeropportunities a:hover {
background: url(/images/10000/3000/914BE/user/volunteeropportunitieshover.gif);
display: block;
width: 220px;
height: 28px;
}
#pastorsblog a {
background: url(/images/10000/3000/914BE/user/pastorsblog.gif);
display: block;
width: 220px;
height: 28px;
}
#pastorsblog a:hover {
background: url(/images/10000/3000/914BE/user/pastorsbloghover.gif);
display: block;
width: 220px;
height: 28px;
}
#employmentopportunities a {
background: url(/images/10000/3000/914BE/user/employmentopportunities.gif);
display: block;
width: 220px;
height: 28px;
}
#employmentopportunities a:hover {
background: url(/images/10000/3000/914BE/user/employmentopportunitieshover.gif);
display: block;
width: 220px;
height: 28px;
}
#enter a {
background: url(/images/10000/3000/914BE/user/enter.gif);
display: block;
width: 14px;
height: 28px;
}
#enter a:hover {
background: url(/images/10000/3000/914BE/user/enterhover.gif);
display: block;
width: 14px;
height: 28px;
}
#photo {
border: 1px solid black;
}
</style>
</head>
<body>
<div id="all">
<div id="firstright">
<div align="center">
<form style="margin-bottom: 5px;" method="get" action="http://www.google.com/search">
<input id="google" name="q" type="text" size="20" maxlength="255" value="Google search" onfocus="select();" /><img src="/images/10000/3000/914BE/user/google.gif" style="margin:0px; padding:0px;"/>
<div style="margin-top: 7px; margin-bottom: 8px;"><input type="submit" value="Search" />
<input type="checkbox" name="sitesearch" value="bbcfnc.org"/><font size="2">only search </font>
</div>
</form>
<table cellspacing="2" cellpadding="0" id="linkboxes" width="240">
<tr>
<td align="center" valign="middle"><div id="beforeyouattend"><a href="/10000/3000/914BE/welcome"></a></div></td>
<td width="14px" height="28"><div id="enter"><a href="/10000/3000/914BE/welcome5"></a></div></td>
</tr>
<tr>
<td align="center" valign="middle"><div id="weeklybulletin"><a href="/images/10000/3000/914BE/user/ThisWeeksBulletin.pdf"></a></div></td>
<td width="14px" height="28"><div id="enter"><a href="/10000/3000/914BE/ministry10"></a></div></td>
</tr>
<tr>
<td align="center" valign="middle"><div id="volunteeropportunities"><a href="/10000/3000/914BE/floating4"></a></div></td>
<td width="14px" height="28"><div id="enter"><a href="/10000/3000/914BE/floating4"></a></div></td>
</tr>
<tr>
<td align="center" valign="middle"><div id="pastorsblog"><a href="http://pastorseansblog.blogspot.com/"></a></div></td>
<td width="14px" height="28"><div id="enter"><a href="http://pastorseansblog.blogspot.com"></a></div></td>
</tr>
<tr>
<td align="center" valign="middle"><div id="employmentopportunities"><a href="/10000/3000/914BE/floating6"></a></div></td>
<td width="14px" height="28"><div id="enter"><a href="/10000/3000/914BE/floating6"></a></div></td>
</tr>
</table>
</div>
</div>
<div id="firstleft">
<div>
<a id="links" class="pointer" href="#links"><img width="500" height="200" id="photo" src="/images/10000/3000/914BE/user/homepagegallery01.gif" /></a>
<ul id="tablist">
<li><a class="buttons" id="previousbutton" onclick="prev()" onmouseover="number=1; changecontent();" onmouseout="number=2; changecontent();">PREVIOUS</a></li>
<li><a class="buttons" id="pausebutton" onclick="pause()" onmouseover="number=3; changecontent();" onmouseout="number=4; changecontent();">PAUSE</a></li>
<li><a class="buttons" id="nextbutton" onclick="next()" onmouseover="number=5; changecontent();" onmouseout="number=6; changecontent();">NEXT</a></li>
<li><a class="buttons" id="servicetimes" onmouseover="number=7; changecontent()" onmouseout="number=8; changecontent()" href="/10000/3000/914BE/floating5"> SUNDAY WORSHIP SERVICES: 8:30am, 10:45am, 6:00pm</a></li>
</ul>
</div>
</div>
<img align="middle" height="3px" width="185px" src="/images/10000/3000/914BE/user/blank.png"/><br>
<a href="http://www.e-giving.org/start.asp?id=1556"><img src="/images/10000/3000/914BE/user/egiving.gif" alt="E-giving" align="middle" width="185" height="185" hspace="0" vspace="0" ></a>
<a href="/10000/3000/914BE/staff1"><img id="welcome" align="middle" onmouseover="number=9; changecontent()" onmouseout="number=10; changecontent()" height="187px" width="370px" src="/images/10000/3000/914BE/user/Welcome-To-Berean.gif"/></a>
<a href="http://www.bbcfnc.org/media/media/recent.php"><img id="sermonconnect" onmouseover="number=11; changecontent()" onmouseout="number=12; changecontent()" src="/images/10000/3000/914BE/user/sermonsonline.gif" alt="Connect" title="Connect" align="middle" width="185" height="185" hspace="0" vspace="0" ></a><br/>
<img align="middle" height="5px" width="740px" src="/images/10000/3000/914BE/user/blank.png"/><br>
<a href="/10000/3000/914BE/history"><img src="/images/10000/3000/914BE/user/UPWARD-box.gif" alt="Upwards" align="middle" width="185" height="185" hspace="0" vspace="0" /></a>
<a href="/10000/3000/914BE/ministry5"><img src="/images/10000/3000/914BE/user/Berean-Baptist-Academy.gif" alt="Berean Baptist Academy" align="middle" width="185" height="185" hspace="0" vspace="0" /></a>
<a href="/10000/3000/914BE/ShowCalendarMonth"><img src="/images/10000/3000/914BE/user/calendar.gif" alt="Calendar" align="middle" width="185" height="185" hspace="0" vspace="0"/></a>
<a href="/10000/3000/914BE/ministry6"><img src="/images/10000/3000/914BE/user/AWANA-box.gif" alt="Awana" align="middle" width="185" height="185" hspace="0" vspace="0" /></a><br>
<img align="middle" height="5px" width="740px" src="/images/10000/3000/914BE/user/blank.png"/><br>
<div align="center"><img src="/images/10000/3000/914BE/user/BereanCampusPanorama.JPG" width="753" height="172"></div>
</div>
</body>
</html>
I need a solution that doesn't cause the page to display wrong in Firefox, and I'd prefer not to have to use a browser-detection script to document.write different HTML in. I know that would work and I could do that, but I think it would work just as well to stick to the table-based layout that's up on our site now rather than bothering with extra scripts. This is a mixed html, database, and php question. I found this image: http://img.gsmarena.com/vv/pics/sams...eternity-1.jpg And I would like to display it so that the screen part is 240x400 and I would like to run a java app in the screen part. I also want the "?app=whatever" at the end of the url to find the link to "whatever" in a database and use that link for the address to the java app. Finally, I want to set up this database so it contains the name, description, category, link to jad file, and link to jar file of each app. This is my first post here by the way. Hello everybody, I hope you can help me before I pull my hair out! I was about to create a site in Dreamweaver CS3 and decided to add a background image to it via CSS. But whenever I try to preview the index page, I do not see the background image. I have tried to preview it on Firefox, Internet Explorer 7, and Safari. But I cannot see the image at all. What's more frustrating is that the background image displays just fine on the Dreamweaver design preview. I feel like it is taunting me. I have also tried to upload the specific files to a webserver and it still does not display. I have tried to change the image from a jpeg to a png to a gif and still no luck. Before I go on about what else I have tried let me give you some information about my site. I have 3 files: index.html layout.css bg.png Site layout as follows: /index.html /css/layout.css /images/bg.png index.html contains - -------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link href="css/layout.css" rel="stylesheet" type="text/css" /> </head> <body> asdf </body> </html> ------------------------ layout.css contains- ------------------------ @charset "utf-8"; /* CSS Document */ body { background: url("/images/bg.png"); margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } and bg.png is the background image in question. and heres a link to an online upload: http://www.geocities.com/cssnoob69/ What I don't understand is that another site I have built in Dreamweaver with the same CSS background-image declaration works just fine. I have even tried to use the background for that site on the new site but even that does not work. I have tried to find help on google but nothing I found helped. Any help is appreciated and thanks to all who tries to help me out! Here is the link: http://www.averytrips.com/socal.html I've got a TR with a background image applied to it. The background image is supposed to look like this: http://www.averytrips.com/trbg.png Clearly the TDs are messing it up, but I can't for the life of me figure out why. Hello .. First I must say "Excuse me" if I posted in a wrong room...... I searched many threads for some information regarding the best programming technologies for displaying an image slideshow on a home page. Please let me know if you have any do's or dont's related to this. With some many technologies available to display an image slideshow I want to make sure I choose the right method so SE's dont stumble when indexing my site. Thank You ! Hi all -- I'm having an interesting problem. I'm designing a web page that has a navigation banner (home - programs - schedule of events - contact us - downloads) that is made up of a .png for each page (i.e. home.png, programs.png, etc). My page is 1000px wide and all of the navigation banner's images add up to 1000px wide. I'm using JavaScript to create an onMouseOver and onMouseOut effect on each of the images. The problem that I'm having occurs when I tried to add a link (either by <A HREF= or using an image map). Whenever I add a link to the image, a small (3px) area of white space shows up to the right of the image. This shifts all of my other images 3px to the right (and 3 more for each link I add to subsequent images) thus making the total width of the navigation banner over 1000px and the last image gets shoved to a new line. I can find no way to get rid of this white space other than to remove the link from the image. There is no property on the page that adds any sort of padding, margins, or borders to images or links, so I can see no property that has to be changed. Help! How do I get rid of this white space but still keep the link on the image?? [I posted this question on the Adobe forum to no avail, below is a screencap I took of the issue I'm having] Thanks in advance! //kl PS - I am using both IE8 and Chrome to view this webpage. I've set all the margins/padding/borders to 0px. Here is my CSS and the part of the code that pertains to the navigation banner. CSS: Code: <style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
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;
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;
background-image: url(images/blue.bg.png);
background-repeat: repeat;
background-color: #009;
}
.oneColFixCtr #container {
width: 1000px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 0px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColFixCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
body, td, th {
color: #333;
}
#main_banner2 {
margin: 0px;
padding: 0px;
height: auto;
width: 1000px;
}
-->
</style>
</head>
Nav Banner: NOTE:: below HAS to be all one paragraph because if i insert a carriage return in between images, it also adds the white space... Code: <body class="oneColFixCtr"> <!-- MAIN NAVIGATION BANNER --> <!--HOME--><img src="images/nav/home.png" alt="home" name="home" width="82" height="30" border="0" onMouseOver="document.images.home.src='images/nav/home_over.png'" onMouseOut ="document.images.home.src='images/nav/home.png'"/><!--PROGRAMS--><img src="images/nav/programs.png" width="111" height="30" border="0" name="programs" onMouseOver="document.images.programs.src='images/nav/programs_over.png'" onMouseOut ="document.images.programs.src='images/nav/programs.png'"/><!--SCHEDULE OF EVENTS--><img src="images/nav/scheduleofevents.png" width="189" height="30" border="0" name="scheduleofevents" onMouseOver="document.images.scheduleofevents.src='images/nav/scheduleofevents_ over.png'" onMouseOut ="document.images.scheduleofevents.src='images/nav/scheduleofevents.png'"/><!-- CONTACT US--><img src="images/nav/contactus.png" width="119" height="30" border="0" name="contactus" onMouseOver="document.images.contactus.src='images/nav/contactus_over.png'" onMouseOut ="document.images.contactus.src='images/nav/contactus.png'"/><!--DOWNLOADS--><i mg src="images/nav/downloads.png" width="267" height="30" border="0" name="downloads" onMouseOver="document.images.downloads.src='images/nav/downloads_over.png'" onMouseOut ="document.images.downloads.src='images/nav/downloads.png'"/><!--FACEBOOK--><im g src="images/nav/facebook.png" width="90" height="30" border="0" name="facebook" onMouseOver="document.images.facebook.src='images/nav/facebook_over.png'" onMouseOut ="document.images.facebook.src='images/nav/facebook.png'"/><!--TWITTER--><img src="images/nav/twitter.png" width="67" height="30" border="0" name="twitter" onMouseOver="document.images.twitter.src='images/nav/twitter_over.png'" onMouseOut ="document.images.twitter.src='images/nav/twitter.png'"/><!--BLOGGER--><img src="images/nav/blogger.png" width="75" height="30" border="0" name="blogger" onMouseOver="document.images.blogger.src='images/nav/blogger_over.png'" onMouseOut ="document.images.blogger.src='images/nav/blogger.png'"/><img src="images/home_banner.png" alt="home_border" width="1000" height="7" /><br /> Hi... I need to put an alternate image(not text) like 'Image Not Available', if the image is not able to fetch from the database. Is there any method to do this? Thanks in advance. -Swathi Hi, I have a question regarding the code to use to create a horizontal line of small images across the page , from left to right. I want to use them as a horizontal divider between blog posts on our website. The image is a small flower which we use as a logo on our website. This is the image location - http://www.lannacharm.com/files/1/00...ower_small.gif So far I have ended up with a verticle line of images, which is useless, or a block of images which wraps itself around the image above it. That is another problem I am having, how do I place this new line of images below the existing image, or text ? There must be some code I can place between them to separate them. For some reason the line of images insists on going to the right of the existing image. Hope someone can help me with this one. Thank You, Mickmac Hello everyone! My friends and I are launching a new gaming site. We're using Wordpress to do most of the editing, since none of us are very familiar with web design or coding. I can edit the HTML / CSS of the template we're using; I'm happy with the template overall, but I would like to upload our custom Logo graphic. I've got the graphic saved in the FTP, but when I open up the HTML for the page, I quickly become lost. I'm not sure where I'd put the graphic code or even what the code is. I know this isn't much information, but if anyone could post on here or PM me with what else I should provide to help me do this, I will gladly do so. Again, I'm looking to -Upload a custom header graphic -Figure out the proper code to upload my graphic -figure out where in the HTML to put the code to do so I'll gladly supply any other information necessary to help figure this out. Thanks! |
|||||||