|
HTML - Problem With Ul Images
Hi, I am very new to HTML/CSS so you will have to excuse my uselessness!
Please see this webpage http://www.militarystar.co.uk/pages/products.html I set up a UL image in my stylesheet but for some reason this isnt aligning with the text. The star should be next to the text "Available in M/L etc...." but it appears at the left hand side of the page. This is the Stylesheet I am using... body { font-size: 10pt; font-weight: bold; background-color: #336600; color: white; line-height: 14pt; line-left: 5pt; line-right: 5pt; padding-top:5pt; text-align:center; text-indent:24px; } h1 { font: 14pt Verdana; color: white; font-weight: bold; line-height: 20pt; text-align:center; } h2 { font: 10pt Verdana; color: white; font-weight: bold; line-height: 10pt; } h3 { font: 8pt Helvetica; color: white; font-weight: bold; line-height: 10pt; } p { font: 8pt Helvetica; color: white; font-weight: bold; line-height: 10pt; } div.imageleft { float:left; clear:all; text-align:center; font-size:9px; font-style:italic; } img { padding:6px; border:none; } ul{ list-style-image: url(/images/bulletpoint.jpg); } and this is the html <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org.TR/xhtml11/DTD/xhtml11/dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Products</title> <link rel="stylesheet" type="text/css" href="productpagestyles.css" /> </head> <body> <img src="/images/military star logo.jpg" alt="Military Star Logo" /> <h1> Products </h1> <hr /> <p><div class="imageleft"> <a href="http://www.militarystar.co.uk/images/ghillie%20suit.jpg"> <img src="/images/ghillie suit.jpg" alt= "Ghillie Suits" width="200" height="200"/></a> <br/>Click image to enlarge</div> </p> <h1>Great Value Ghillie Suits.</h1> <ul> <li>Available in M/L and XL/XXL.</li> </ul> <a href="http://www.militarystar.co.uk/">Back to the homepage</a> </body> </html> Can anyone advise how to overcome this? Thanks Similar TutorialsThis code is taken from here (select gallery). I have been asked to add extra images to the gallery and the idea is to have a more button and replicate the same page but with new images - but I can't get it to work. I've tried editing the original image names with the new ones I;ve created. The image on the right shows but not on the left. Also the images don't seem to have the border The code: <div style=" margin:16 0 0 22px; line-height:13px " class="w2"><img src="images/4_p1.jpg" alt="" border="0" align="left" style="margin-right:30px "><a href="gallery.html" target="cont"><img src="images/4_p2.jpg" alt="" border="0"></a><a href="gallery2.html" target="cont"><img src="images/4_p3.jpg" alt="" border="0" style="margin-left:19px "></a><br> <br style="line-height:19px "><a href="gallery3.html" target="cont"><img src="images/4_p4.jpg" alt="" border="0"></a><a href="gallery4.html" target="cont"><img src="images/4_p5.jpg" alt="" border="0" style="margin-left:19px "></a><br> <br style="line-height:19px "><a href="gallery5.html" target="cont"><img src="images/4_p6.jpg" alt="" border="0"></a><a href="gallery6.html" target="cont"><img src="images/4_p7.jpg" alt="" border="0" style="margin-left:19px "></a></div> <div style=" margin:15 0 0 167px; line-height:13px " class="w2"><strong>Dream Catcher I have just started to learn HTML and was trying to get images on my exparimental web page. I haven't published the page and I have tried everything to get it to work. I can get images to work on my backround but not on the page itself. i.e.<img src="/pics/mf.gif" width="100" height="100">. I have used the full path name and all pics are in the same folder as my page. All I get is a box on the top left of where the pic should be, its like the image isn't loading. Please help hi, for some reason i cannot see the images i am interting in the dreamweaver split funbction, however when i preview it, all is ok in internet explorer hmmm OK well This workse perfectly with a .html document, but when I use .php it all goes bad, http://rapid-hook.com/script-2/index.php The arrows ar suppose to be aligned with each other, but theres a gap between the table, for the bottom only, not sure how to fix this. Hi, I was trying to develop a page in HTML/CSS but having some difficulties. I have created many pages before but this one is giving me a hard time. What I have done differently this time it, i have used Positioning tags. The problem i am having is I can not set any two divs or images side by side. If i set 1 image and 1 div side by side they are being placed on top of each other. But, i may be going crazy here, i was able to place the top two divs side by side (logo and privacy_protected). Can any one please tell me what i am doing wrong or what i should do? Here is the code that i am using: Code: <body>
<div id="wrapper">
<div id="bodypic">
<div id="logo"><a href="index.html"><img src="images/transparent.png" width="319" height="100" border="0" /></a></div><!--logo -->
<div id="privacy_protected"></div><!--privacy_protected -->
<img src="images/transparent.png" height="29" width="1020"/>
<div id="728block">
<img src="images/transparent.png" height="89" width="18" style="float:left"/>
<div id="728adunit"><img src="images/728x90.jpg" width="728" height="90" /></div><!--728adunit -->
<a href="#"><img src="images/transparent.png" height="89" width="23" style="float:left"/></a>
<a href="#"><img src="images/transparent.png" height="45" width="219" style="float:left"/></a>
<a href="#"><img src="images/transparent.png" height="43" width="202" style="float:left"/></a></div><!--728adblock -->
</div><!--bodypic -->
</div><!--wrapper -->
</body>
And the CSS Code: #wrapper {
height: 1174px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
#bodypic {
background-image: url(images/wrapper.jpg);
float: left;
height: 1174px;
width: 1024px;
}
body {
background:#FFF;
font-family:Arial, Helvetica, sans-serif;
text-align:justify;
font-size:14px;
}
a:link {
color: #06F;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #06F;
}
#logo {
background-image: url(images/Editorial_v3-1_01.gif);
float: left;
height: 103px;
width: 498px;
}
#privacy_protected {
background-image: url(images/Editorial_v3-1_02.jpg);
float: left;
height: 103px;
width: 526px;
}
#728block {
float: left;
height: 91px;
width: 1024px;
}
#728adunit {
float: left;
height: 90px;
width: 728px;
}
a:hover {
text-decoration: underline;
color: #06F;
}
a:active {
text-decoration: none;
}
Please help! Hello All, Wondered if anyone could help. Have designed a website at www.kerrsminaturerailway.co.uk. The first problem is the JQuery slide menu nav bar does not match the width of the body. I've set the width of the nav bar as 100% on the CSS, and with both Firefox and Internet Explorer, there is a white gap on the right hand side. Any ideas how to fill this in and have a nav bar the width of the body? The second problem is I have two links on the banner area, to a Facebook and Twitter group, but both images appear to be hidden by the banner. How do I get them to overlap the banner? Many thanks in advance, we'd be grateful of any help on both, to smarten up the website. Peter Hey guys, I'm managing this website that my boss created. I'm a devoted Dreamweaver user and she created it HTML style. I need help because I can't figure out why it's not showing up in Internet Explorer, Firefox, and Netscape. It shows up in Safari, but that's not going to satisfy our client. Here's the url: http://www.kwph.com it's the logo under the About Us section. Thank you for any help Jordan I'm about to rip my hair out on this one. I'm using Dreamweaver 8. I have navigation that is using image rollovers to swap. My images that are needed for the rollover to work are in my "assets" folder in the "root" directory. However, when I create the actual html page off the template it is looking for the image in "templates/assets" and therefore does not find the image to swap. I have a number of different navigation buttons and I inserted them all the exact same way. This is the only one that is having this issue, the rest work properly. This is the code that resides on the templates page. Code: <p class="navimage">
<a href="../logset.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Log & Grate Set','','..assets/menu/log_over.jpg'',1)"><img src="../assets/menu/log_default.jpg" alt="Log & Grate Set" name="Log & Grate Set" width="158" height="34" border="0" id="Log & Grate Set" /></a></p>
Notice the Set','','..assets/menu/log_over.jpg. This is the code that is produced when you create an html page from the template. Code:
<a href="logset.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Log & Grate Set',Templates/'','..assets/menu/log_over.jpg'',1
For some reason it is adding the directory templates, and therefore does not find the image. Does anyone know how I can fix this? Thanks, braves07 Greetings, I just recently started learning HTML and I am currently taking an HTML class in my college. One of my assignments was to create a web page with a certain amount of requirements but for some reason my teacher was not able to view the pictures when she tried to look at my assignment. Can someone please take a look at my source code and let me know what is wrong with it? <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <title>Internet Security</title> <style type="text/css"> h1 {text-align: center} h3 {text-align: center} body {background-color: #FFEBCD} </style> </head> <h1>Security and the Internet</h1> <body> <p>Internet Security has become vital in today's society. With the imposing attempts to breach other computers, it is important to have good anti-virus software. Viruses can come in many different types. First and foremost are your standard <em><strong>trojan viruses</strong></em>. These viruses are used to steal passwords so the hacker can attempt to gain pertinent user information. Another form of a virus is a <em><strong>boot virus</strong></em>. A boot virus infects floppy disk or master boot records on a hard drive. They replace the boot record program (which is responsible for loading the operating system in memory) copying it elsewhere on the hard drive or overwriting it. Boot viruses load into memory if the computer tries to read the disk while it is booting.<hr /></p> <h3>Other Types of Security Dilemmas</h3> <p>Other security problems that are slowly rising include wireless network hacking. In this particular method of breaching, the perpetraitor attempts to steal a wireless connection by using DOS (denial of service attacks), man in the middle, Identity theft or MAC spoofing and sometimes, caffe latte attacks. The most frightening part of this type of breach, or any for that matter is the hackers ability to gain personal information by using the aforementioned methods. It is very important to secure your computer with an anti-virus program as well as, a firewall to ensure you are not a victim. Below is a security checklist which will aid in keeping hackers out of your system.<hr /></p> <h4 style="color:#DC143C">Ways to Stay Internet Safe</h4> <!-- The following six lines represent how ordered list work and would appear on a web page --> <ol> <li>Install an anti-virus program and firewall and, <strong>keep the definitions up to date</strong></li> <li><strong>NEVER</strong> open any attachments unless you know the sender</li> <li>Do not close your anti-virus and firewall. Real time protection is often active while they are open</li> <li><strong>DO NOT</strong> visit un-safe websites. Again, virus protection usually has a site watch plug in to aid in this</li> </ol> <p>Follow these helpful tips and you should remain virus free</p> <p>The following pictures to the right indicate two great antivirus and spyware programs used for Internet security today. I personally use both of these. Each of these particular pieces of software serve their own purpose. The AVG Free is used for scanning for viruses while the SuperAnti-Spyware is used to scan and resolve issues pertaining to spyware and adware. <!-- Picture links are displayed below --> <p><a href="http://free.avg.com/" title="click here to visit AVG's website"> <img src="AVG.gif" alt="photo of anti-virus software" border="0" align="right" width="140" height="140"/></a></p> <p><a href="http://www.superantispyware.com/" title="click here to visit SuperAnti-Spyware's website"> <img src="super.gif" alt="picture of SuperAnti-Spyware" border="0" align="right" width="140" height="140"/></a></p> <br> <br> <br> <br> <br> <br> <br><hr /> <p>In the next few steps I am going to describe how to stay virus free if using a wireless network</p> <h2 style="colorC143C">Instructions For Setting Up a Safe Wireless network</h2><br> </body> </html> I want to try a couple of different approaches to putting medieval scroll-like images behind a menu and the body text of a site I am working on. I vaguely remember that there are separate commands to put images above, behind, and below a list. (Thinks something like scroll_top.gif, scroll_body.gif, scroll_bottom.gif). Can anyone help with that? Also, isn't there a way to do the same think with a div, eg: - image1 at the top - image 2 (repeating) as the body - image 3 at the bottom Thanks much as always! Joshua ok i found a website i registerd got my domain and i uploaded my website my index.html and all the other files and i added all my images but wen i look at my site the images do not appear its just the blank site with text what do it? The title thread says it all i can't get the image next to each other it always seems to end up underneath...here is a screenshot. The arrow is pointing to were I want it to go. So how do I do thi guys ? I could not find any previous post for this question but someone has sure had the same problem. Everying looks fine on my website if you use: http://sdgroceryoutlet.com However, if you use: http://www.sdgroceryoutlet.com it scrambles the .jpg images. Why would the images not show when adding the www. prefix? Need some help, please. Hi My site is at www.bigbadroo.com.au/dht/index.php It's looking ok in most browsers at the moment, but I have a couple of questions: 1) why is ie6 cutting off and repeating the background images? 2) why is ie6 putting big red crosses and borders on my three main button images? 3) how do I get the DIV box1 to extend all the way to the top of the screen in IE6 and IE7? Thanks for your time and help guys. Shaun Hello, Yes on the same computer, I am quite happy with FF, but when I check the same image on IE, it seems lower quality image even though it is the same image on the same site!! how can i put images on my page using html or css where you cant right click and copy the image or see the image url. (kinda like a background image, but where i can add several of them) On Opera when you place the mouse on an image it shows the file On Mozilla and Netscape it doesn't show ALT at all. Can this be sorted out? Thks Heyya, new here, and still fairly new to html. I just started using SSI includes (for obvious reasons), but I'm having an issue. When I preview the actual include file (menu.html), it looks just like it should. To see what it should look like, check out the front page, which just uses the HTML code rather than an insert. www.armoredchampions.com But when I use the include on a page, there is a gap between the two lines. I was originally using a <br> tag, but it had a gap, as if I was using <p>. I then eliminated the tag and made the table border just a little bit wider than the image in order to solve the issue, but the gap is still there. To see what it looks like you can check out this page: www.armoredchampions.com/staff.shtml Can anyone help me with this? I would really really appreciate it I have a two questions if you see an image on the web for example a map you would like to create yourself can you look at the webpage's source and use that as a guide? Does copyright laws apply? Well second question will come when I get an answer to first question. Thanks sunrise Hi, im new to this so sorry for my lack of knowlage. Anyway, I have made a new directory on my website to house our gaming reviews I have copied exactly the same image directorys that work on our main directory in there and the images show up when previewing on my pc but not when i upload to the web, also appartnly no images or styles work in IE? www.gameoracle.co.uk help much appriciated |
|||||||