|
HTML - Fonts Are Messed Up
Hello!
I have a problem with my webpage, only occuring when I am surfing with Firefox. I have an identic code on two different pages, but on one of them the letters look normal, on the other one they are suddenly messed up. At the pictures it can be seen. I have no clue why it is happening... can anyone help? The text is good at for example: http://www.hungarybudapestguide.com/restaurants/ - but if I go in to read about whatever restaurant later described the texts are messed up in Firefox as seen on the picture. How come? Similar TutorialsHi all, This is my first post here. I was wondering if anyone can give me some advice on some goof looking fonts I can use in my HTML documents. I would like to hear some suggestions on fonts that look good when they are small like 8pt. I'm use Verdana and it looks good for the most part, but I see some websites where they have small bold fonts that look good. Some examples I was looking at were target.com, sears.com etc... I would appreciate any ideas. Thanks when you the page i am working on in IE it does not line up the div tag correctly, p.s. the background is black for debuging reasons http://userpages.umbc.edu/~zane1/temp/insurethisnow/ soak digital did a great helping me! thanks! (sorry for the added post, i had a question but i answered it myself. D'OH!) Hey guys, Im new on here but i need some help with a table. http://er0r.freehostia.com/test.html -See how in the content section its writing is about half way down the page? How can i make it at the top? Quote: The coding : HTML Code: <center> <table cellspacing="1" cellpadding="0" border="0" bgcolor="black" id="shell" height="250" width="400"> <tr height="50"><td colspan="2" bgcolor="white"> <table title="Banner" id="banner" border="0"> <img src="http://er0r.freehostia.com/er0rbannah.jpg"> </table> </td></tr> <tr height="200"><td bgcolor="white"> <table id="navigation" title="Navigation" border="0"> <a href="http://er0r.freehostia.com/about.html"> <img src="http://er0r.freehostia.com/about.jpg" border="0"> <br> <a href="http://er0r.freehostia.com/baits.html"> <img src="http://er0r.freehostia.com/baits.jpg" border="0"> <br> <a href="http://er0r.freehostia.com/files.html"> <img src="http://er0r.freehostia.com/Files.jpg" border="0"> <br> <a href="http://er0r.freehostia.com/tutorials.html"> <img src="http://er0r.freehostia.com/tutorials.jpg" border="0"> <br> <a href="http://er0r.freehostia.com/Guestbook.html"> <img src="http://er0r.freehostia.com/Guestbook.jpg" border="0"> </table> </td><td bgcolor="white"> <table title="Content" id="content" border="0"> <tr><td>Content goes here</td></tr> </table> </td></tr></table> </center> Thanks er0r Hi, It's the first time I'm using custom fonts on a site, wondering why these rows don't work in Internet Explorer? HTML Code: @font-face {
font-family: Myriad Pro;
src: url(fonts/MyriadPro-Regular.otf) format("truetype");
}
@font-face{
font-family: Giddyup Std;
src: url(fonts/GiddyupStd.otf) format("truetype");
}
@font-face{
font-family: Orator Std;
src: url(fonts/OratorStd.otf) format("truetype");
}
Hi all.... Ive been having issues trying to get these two lists below to look the same. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>MESH, Inc. - Home</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div id="container">
<img id="banner" src="images/topbanner.png" alt="top banner">
<ul id="top-nav">
<li><a href="mcad_project.html">mcad<span id="mcad"></span></a></li>
<li><a href="niosh_project.html">niosh<span id="nios"></span></a></li>
<li><a href="mcad_project.html">mcad<span id="moad"></span></a></li>
<li><a href="mcad_project.html">mcad<span id="scad"></span></a></li>
<li><a href="cloud_mapping.html">cloud<span id="clou"></span></a></li>
<li><a href="cloud_mapping.html">cloud?<span id="what"></span></a></li>
</ul>
<ul id="nav">
<li><a id="active" href="home.html">Home</a></li>
<li><a href="products.html">Products</a></li>
<li><a href="services.html">Engineering Services</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="publications.html">Publications</a></li>
<li><a href="contact_us.html">Contact Us</a></li>
<li><a href="about_us.html">About Us</a></li>
</ul>
<div id="content">
<div align="center"><span style="font-weight:bold;">ENGINEERING SERVICES</span></div><br>
<p>
Since 1978, MESH has been providing clients with engineering services to
solve their most complex problems. We specialize in:
</p>
<ul id="services">
<li>Software and hardware interfaces </li>
<li>Real-Time Software </li>
<li>Prototyping </li>
<li>Sensor Interfacing </li>
<li>Signal Processing </li>
<li>Electronic Design </li>
<li>User Interface and Design</li>
</ul><div align="center"><span style="font-weight:bold;">CHEMICAL/BIOLOGICAL STANDOFF MONITORING PRODUCTS</span></div><br>
<p class="padding-bottom">MESH provides leading edge technology to safeguard people and facilities from chemical and biological hazards. The MESH standoff systems, unlike point detectors, are not dependent on airborne threats finding their way to the detector or sampling point. The standoff sensors include: </p>
<ul id="services2">
<li>MCAD – Standoff sensor for chemical vapors at distances in excess of 6km </li>
<li>Dragonfly – Standoff aerosol sensor (either chemical or biological). </li>
<li>Firefly – Standoff vapor or aerosol hyperspectral imager based on innovative technology, resulting in an affordable approach to the next generation of chemical sensing. </li>
</ul>
</div><!-- end #content -->
<div id="footer">610-932-7754 <a href="mailto:info@meshoxford.com">info@meshoxford.com</a></div>
</div><!-- end #container -->
</body>
</html>
Heres the style sheet.... dont think this is the problem Code: body {
margin:10px;
background-color:#f0f0f0;
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
overflow-y:scroll;
}
#container {
width:776px;
margin:auto;
background-image:url(../images/container-white-bg.png);
box-shadow:#333 15px 15px 30px;
}
#banner {
display:block;
width:760px;
height:120px;
padding:8px 8px 0 8px;
background-color:#066;
}
#top-nav {
width:768px;
height:81px;
padding:8px 0 8px 8px;
margin:0;
list-style-type:none;
background-color:#066;
}
#top-nav li {
float:left;
margin-right:8px;
}
#top-nav a,#top-nav span {
position:relative;
display:block;
width:120px;
height:81px;
line-height:81px;
font-size:90%;
font-weight:bold;
color:#000;
text-align:center;
background-color:#cff;
}
#top-nav span {
position:absolute;
top:0;
left:0;
background-image:url(../images/gallery-banner.png);
}
#top-nav span:hover {
opacity:0.5;
filter:alpha(opacity=50);
}
#top-nav a:hover {
text-indent:-9999px;
}
#top-nav #active-top:hover {
text-indent:0;
}
#top-nav a:hover {
text-indent:-9999px;
}
#top-nav #active-top span {
display:none;
}
#mcad {background-position:-8px -8px;}
#nios {background-position:-134px -8px;}
#moad {background-position:-260px -8px;}
#scad {background-position:-386px -8px;}
#clou {background-position:-512px -8px;}
#what {background-position:-638px -8px;}
#nav {
float:left;
width:120px;
padding:0 8px;
margin:0;
list-style-type:none;
background-color:#066;
}
#nav li {
margin-bottom:2px;
}
#nav a {
display:block;
width:120px;
padding:30px 0;
font-size:90%;
font-weight:bold;
color:#000000;
text-align:center;
background-color:#699;
}
#nav a:hover {
color:#fff;
}
#nav #active {
background-color:#cff;
}
#nav #active:hover {
color:#000;
}
#content {
float:left;
width:610px;
padding:25px 15px 10px 15px;
}
h1 {
margin:0 0 10px;
font-size:140%;
text-align:center;
}
#content p {
margin:0 0 10px;
font-size:90%;
color:#000;
}
#services {
font-size:110%;
color:#000;
}
.text-indent {
text-indent:20px;
}
.padding-bottom {
padding-bottom:16px;
}
#footer {
clear:both;
line-height:30px;
font-size:90%;
color:#cff;
text-align:center;
background-color:#066;
}
#footer a {
margin:0 40px;
color:#cff;
}
Thanks Coothead edit: photo of what it looks like in FF I have created a website which works perfectly in IE7/8 and FF but its all messed up in IE6. Please someone help me fix it. HTML Code: http://www.paknus.com/nus Code: <p><center><table width="50%" bgcolor="black" cellpadding="20px"><tr><td><a href="index.html">Home</a></td><td><a href="imglist.html">Img list</a></td></tr><td><a href="about.html">About</a></td></tr></table></center></p> in ie the center works fine, but in firefox its almost 2 inches to the left of being center, why would that be? IE is working fine for once, but when I view it in FF there are the bullets for the <li> showing up. How can I get rid of them ? Html: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="Keywords" content="beveled, glass, mirror, beveling, bevel, company, custom, design, shaped, shapes, curved, curves, round, polished, edgework, business, small, residential glass,
etched glass, plate glass, tempered glass, tempered, replacement, replacement windows, remodel, window screens, screens, door screens, mirror, mirrors, custom glass and mirror,
custom, Milford CT., ct., Milford,">
<title>Custom Glasss & Mirror</title>
<link rel="stylesheet" href="style2.css" type="text/css" media="screen" />
</head>
<body>
<h5>Visit Our Newley Remodeled Showroom At 807 Boston Post Rd. Milford, Ct.</h5>
<div id="container">
<!-- Start of Page Header -->
<div id="header_container">
<div id="page_header">
<div id="header_company">
<img src="images/header6.jpg" width="500" height="200">
</div>
<div id="header_menu">
<ul>
<li><a href="#" /><span>Home</span></a></li>
<li><a href="about.html" /><span>About Us</span></a></li>
<!--li><a href="service.html/"><span>Services</span></a></li-->
<li><a href="gallery1.html" /><span>Photo Gallery</span></a></li>
<li><a href="contact.html " /><span>Contacts</span></a></li>
</ul>
</div>
<div id="header_welcome">
<div id="welcome_text">
</div>
</div>
</div>
</div>
<!-- End of Page Header -->
<!-- Start of Left Sidebar -->
<div id="left_sidebar">
<!-- Start of Latest News -->
<div class="box_container">
<div id="news">
<h4>
Glass
</h4>
We have a wide range of choices when it comes to glass. Whether it's for a table top, cabinet door or replaceing your picture window,
we have a piece of glass for you.
<div class="link-more">
<a href="glass.html" />...more</a>
</div>
<h4>
Window & Door Screens
</h4>
We can replace any size window or door screen. Do you have a damaged frame ? Bring it in, we can make you a new one.
We even have paw proof screens .
<div class="link-more">
<a href="screen.html"/>...more</a>
</div>
<h4>Home Improvment</h4>
We now offer full home improvements. From kitchens and bathrooms, to a full addition.
<div class="link-more">
</div>
<h4>Shower & Tub Enclosures</h4>
We carry a full line of standard and custom shower and tub enclosures.
<div class="link-more">
<a href="enclosures.html"/>...more</a>
</div>
</div>
<div class="clearthis"> </div>
</div>
</div>
<!-- End of Latest News -->
<!-- End of Left Sidebar -->
<!-- Start of Main Content Area -->
<div id="maincontent_container">
<div id="maincontent">
<div id="maincontent_top">
<!-- Start of How We Started -->
<div id="started_container">
<div id="started">
<center>
<table border="0" width="100%">
<tr>
<td><h5> Free Estimates </h5></td>
<td> </td>
<td><h5> Fully Licenced and Insured</h5></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
* Beveled Glass & Mirror<br>
*Table Tops<br>
*Plate Glass<br>
*Plaxi Glass<br>
*Patterned Glass<br>
*Thermo Units<br>
*Storm Doors & Windows<br>
*Storm Door & Window Screen Repair<br>
*Vinyl & Wood Replacement Windows<br>
*Shower & Tub Enclosures<br>
*Home Improvment<br>
*Store Fronts<br>
... and much, much, more
</div>
</div>
<!-- End of How We Started -->
<div id="right_container">
<!-- Start of Get Special Offer -->
<div id="offer_container">
<div id="offer">
We carry a complete line of cleaners to keep your
glass, mirrors and shower enclosures as clean as the first day we installed them.
<p>
<center>
<img src="images/products_ava.jpg">
<p>
<a href="cleaners.html"/>...More</a>
</div>
</div>
</div>
<div class="clearthis"> </div>
<!-- End of Get Special Offer -->
<!--Start of repair-->
<div id="repair">
<div class="link-more">
<a href="screen.html" /></a>
</div>
</div>
<div class="clearthis"> </div>
<!-- End of We Also Do Repairing -->
</div>
<div class="clearthis"> </div>
</div>
<!-- Start of Featured Products -->
<div id="featured_container">
<div id="featured">
<center>
<!--a href="gallery1.html">Photo Gallery Preview</a-->
<div id="featured_products">
<ul>
<li><img src="http://i39.photobucket.com/albums/e197/wrathchilds-santuary/glass%20shop/brassline_b-1669-lg.jpg" height="100" width="90" alt="" /></li>
<li><img src="http://i39.photobucket.com/albums/e197/wrathchilds-santuary/glass%20shop/brassline_b-1631-b-lg.jpg" height="100" width="90" alt="" /></li>
<li><img src="http://i39.photobucket.com/albums/e197/wrathchilds-santuary/glass%20shop/brassline_b-158-lg.jpg" height="100" width="90" alt="" /></li>
<li class="end"><img src="http://i39.photobucket.com/albums/e197/wrathchilds-santuary/glass%20shop/mirror3.jpg" height="100" width="90" alt="" /></li>
</ul>
<div class="clearthis"> </div>
</div>
<div class="clearthis"> </div>
</div>
</div>
<div class="clearthis"> </div>
<!-- End of Featured Products-->
</div>
<!-- End of Main Content Area -->
<!-- Start of Page Footer -->
<div id="page_footer">
Copyright 2007 <a href="http://wrathchild.edit-strike.nl" />Wrathchild Productions</a>
</div>
<!-- End of Page Footer -->
<div class="clearthis"> </div>
</body>
</html>
My Css is in the post below. Hi, I have the html coding below that shows the bullet point with a caption below it. How would i format the actual bullet point to be a different size and colour to the caption below it? Thanks Code: <ol> <li>abc</li></br> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <li>abcd</li></br> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <li>abcde</li></br> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </o> is it possible?? it's not working by any approach! i read about htaccess but didn't know how exactly i can use it to embed a font, if it solves firefox problem how can i use it?? here is the code, u will see eveything i tried Code: <!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 REL=FONTDEF SRC="http://www.site.com/CHILLER0.eot">
<style>
@font-face {
font-family: CHILLER0;
font-style: normal;
font-weight: normal;
src: url(http://www.site.com/CHILLER0.eot);
}
@font-face {
font-family: CHILLER0;
font-style: normal;
font-weight: normal;
src: url(http://www.site.com/CHILLER.TTF) format("truetype");
}
.psycho {
font-family: "CHILLER0", Verdana, sans-serif;
font-size: 48px;
color: #000099;
}
</style>
</head>
<body>
<!--[if !IE]> <!-->
<embed type="application/pdms-weft-plugin" font_face="CHILLER" src="http://www.site.com/CHILLER0.eot" hidden="true" pluginspage="http://pakdata.com/products/pdms-weft-plugin" />
<!--<![endif]-->
<p class="psycho">This Looks Embedded to Me</p>
</body>
</html>
really appreciated :hat: All of a sudden I can't put in an affiliate link that contain an image. There's no problem with a text link. I've tried all kinds of links but none of them work. Every time I put one in a "img class with 4 random 20 character sets jumps in and the link doesn't work. Here is what I mean I put this in <a href="http://www.tkqlhce.com/click-4072394-10684742" target="_top"> <img src="http://www.awltovhc.com/image-4072394-10684742" border="0" alt="$5.99 Flat Shipping up to 15lbs" width="120" height="90" /></a> and this comes out <a href="http://www.tkqlhce.com/click-4072394-10684742" target="_top"> <img class=" gyucpbdejrxphzavvzpr gyucpbdejrxphzavvzpr" src="http://www.awltovhc.com/image-4072394-10684742" border="0" alt="$5.99 Flat Shipping up to 15lbs" width="120" height="90" /></a> I imagine it's something I have done as I seem to be able to mess up just about everything in my computer sooner or later. I sure would appreciate any help I can get on this as I've been playing with it for the past week. Thank you, donrock I am working on a site, and want to make 3 tables (one on top of another). Here is an image depicting what I want to do: Layout. I made the layout without 3 tables, just one, and it works fine. Here it is: 1 Table. But when I make three tables, like the picture shows, it messes all the spacing up. 3 Tables. I am doing all of this because I want to make a form and to make a form all of the fields need to be in one table. Here is how far I got with the form: 3 Tables and Form. Any help would be greatly appreciated. Thanks, Matt **Also, the site looks better in firefox than IE, so view it in IE to see the real problems. Hey, Well, I made this webpage, and when I preview in IE its ok, but in opera theres something messed up. I use table (I know thats bad, but I'v got it to work before), and I use css to script hoover images(buttons) in the menu and stuff. When I preview these in Opera, it shows both the ordinary image, and the hoover image partially overlapping and making the table bigger and messe sup everything. Any ideas? I really hope someone can help me with this. About 2 months ago all my websites plummeted in the search engines. I found out later that i had a permalink structure problem which i solved by disabling a certain plugin. After that, i thought my rankings would have returned but unfortunately they didn't. With no clue as to where to go from there, i contemplated deleting my 5 websites and starting again from scratch. Then i noticed my keywords showing up in Google were messed up. All of my posts on all websites had the "website title" tacked onto the end of each post. Example: I have a post called "Natural Sleeping Remedies" When this post shows up in the search engines it looks like this... Natural Sleeping RemediesNatural Health Remedies As you can see, the title of my website homepage (Natural Health Remedies) is tacked onto the end of my post title. This happens with every post, on all websites. No matter how much i changed the post title, nothing helped. I thought that if i changed the theme, it would solve the problem. So, i tried theme after theme and finally came across one that worked. But, the big problem now is that i can only use one theme for all my sites which is just not appropriate for some sites. Every time i want to use a new theme, the homepage title always gets tacked onto every post, unless i use the same theme all the time. Has anyone had this problem before? Any ideas how to fix this? At the moment all is fine because i use this one theme, but i really don't like it. P.S. I created another website last week and the same problem is always there. Is there a php file or html file that i can look at to determine what is happening. I'm a newb when it comes to this sort of stuff. Feeling dejected at the moment. Thanks in advance for any replies. Code: <p><center><table width="50%" bgcolor="black" cellpadding="20px"><tr><td><a href="index.html">Home</a></td><td><a href="imglist.html">Img list</a></td></tr><td><a href="about.html">About</a></td></tr></table></center></p> in ie the center works fine, but in firefox its almost 2 inches to the left of being center, why would that be? ive tried to change the precent and all, but that doesnt do a thing. got a very basic page as this stuff is super new to me, not sure where to put or ask about this ... when the page is resized or when the bookmarks tab comes on in firefox browser my graphics all move around , didn't use to do this but i'm not sure. happens when u resize the actual page. everything kinda lines up to fit in the new space --- i really dont know -->loaded page up temporarily http://www.legendofthegknight.com/test/index.html Hi. I'm a FP/html/website builder noob. Is there a way to change all fonts/all backgrounds in FP2003/with html? e.g. Is there an easy way to change all fonts in headers, text areas, tables etc from one font to another. Thanks. Hi, I would like to know exactly how do I specify a font and a color for specific head line or titles in a text using HTML. For example what code should I use if I wan't an Italian Cursive, 16th Century font light gray color as a headline. I'm really not using Dreamweaver, I've done everything with HTML, but if you consider it's easier to use CSS, would you tell me how is it done? Thanks a lot. |
|||||||