Jump to content

Search the Community

Showing results for tags 'font'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

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

Calendars

  • Community Calendar

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 19 results

  1. Hello everyone. (Sorry for my bad english, I'm french)So I have an HTML page with a header, a footer, a lateral menu and of course, content.It is perfectly sized for desktops and mobiles (thanks to a media query I invented, which is : @media screen and (max-aspect-ratio: 7/8) and (min-height: 1100px){ /* MY CODE HERE */ } The content is perfectly adjusted like this : , thanks to: html{font-size: 200%} in this media query. I precise that ALL my font-sizes and padding between divs / paragraphs are in "rem" unit. But the problem is, that when I exceeds the precise nuber of 89 characters, the texte suddenly look like this : But only on mobile devices (with the media query I said previously)... I visualized this with the Chrome developer tool -> Device toolbar (Ctrl + Shift + I then Ctrl + Shift + M) There I do a little as if it was not serious but it's days that I drudge everywhere and nobody was able to give me an answer ... I put the page online so you can watch it more precisely...http://vincentvincent.rf.gd/l-histoire.html Thanks for your help.
  2. I downloaded the latest w3.css framework and updated the css for html, body to use a different font-family. html,body{font-family:'Lato','Open Sans',font-weight:300;sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden} However when I did that the font that is now displayed when I use the following code displays an incorrect (and serif) font. <div class="w3-container w3-panel w3-card-2 w3-blue"> <b>System Alert:</b> <br /> System currently in <em>Development Mode</em> </div> What gives? How can I get this to resolve.
  3. dominicw

    Font Stretch

    I am interested in the CSS font-stretch property, but I am struggling to find any information about which fonts support condensed and expanded variants. Does anyone know of any cross-platform fonts that support this? I would like to avoid loading fonts from an external source if possible.
  4. Hello, this is my site: http://cvkj.agencialosnavegantes.cl/ I have a font called "Averta" and i uploaded via FTP all the .otf filesto the /wp-includes/fonts/ on my WordPress. Now i'm calling it like this on the Custom CSS: @font-face { font-family: "Averta"; src: url("http://cvkj.agencialosnavegantes.cl/wp-includes/fonts/AVERTA LIGHT.OTF"); } body { font-family: "Averta"; font-weight: normal; }
  5. johoki

    Small caps rendering

    Hi guys! I'm currently working on a new online store and i have a small issue that really bugs me. I'm using "font variant: small-caps" + "text-transform: lowercase" for the menu and all headlines (Font: "Questrial"). It looks great in Chrome and Safari on my Mac and almost as good on my Galaxy S6.. but Firefox, it looks like the small caps ate too much food. They are too thick! The body text is as far as i can see the same. I'm no expert, but i understand that the browsers render fonts (or the small caps in my case) differently. My question is if there is any way to work around this or should i just accept the fact? Many thanks!
  6. Hello, I'm working at a site in wordpress, I use 'inspect element' a lot, and I want to know how can I see all the default font styles and their preview, so I can choose it more easily. In inspect element it only shows me the one available for font-family : serif, sans-serif, monospace, fantasy etc. Is there maybe a site or something (or a chart) where I can instantly see all those default text styles (so not something I have to download), and their preview? Thanks.
  7. Hello, for the longest time we were using FPDF to generate our pdf invoices. We recently upgraded to TCPDF and noticed we lost the bold font style. Our system admin says the font files are where they should be, in fact we can call $pdf->SetFont( 'Arial', 'BI', 10 ); and it is bold italic. Pass in 'I' and it is Italic but if we only pass in 'B' for bold, it display as normal font, no style. In the older FPDF, bold worked fine. Is there something we might be missing? We really need headers, certain labels and info to stand out in bold. Thank you for any help with this. Running the latest version of TCPDF on a Linux server. Thank you for any help with this.
  8. Hi! This actually my first post, but excited to finally be part of the W3 forum! So I recently installed a WP template and started customizing it and used the Page Builder option for a few of the pages. My question is on the home page where the 3 icons are, yellow blue yellow, below them is text. I have tried to alter the color of the text when I go to the HOME page itself in the WP admin to just highlight and change font color and then when I update it just goes back to what it has been. Wondering if it is the Page Builder messing with it? Tried also going into the style.css to look for where i could alter it but am having trouble there as well.. Any help would be appreciated! Thanks! heres the site - www.asamusic.us
  9. How to change only part of the font to a different color in a navigation link? See my website; www.cleareyesight-batesmethod.info On the left < is the navigation. I want the top words in each pages navigation to be in green and the rest of the text to stay navy blue. Example, in the home page, top navigation; I want NATURAL EYESIGHT IMPROVEMENT to be green. The rest of the text under it to stay navy. When I try to change the color it does not work and it also causes spaces between the 2 different colored text. How to do this? Maybe in html? Thanks, Mary
  10. i created a page for testing diffrent fonts but its not working.cant find the problem maybe you can help me . thanks @charset "utf-8";@font-face { font-family:'lottepaperfang'; src: url(‘}@font-face { font-family: 'Astri1'; src: url(‘}@font-face { font-family:'Astronau' ; src: url(‘}@font-face { font-family:'MarketDeco' ; src: url(‘}@font-face { font-family: Astri2; src: url(../Homepage2/fonts/Astri2.ttf);}@font-face { font-family: 'lekton005' ; src: url(‘}@font-face { font-family:'Normat' ; src: url(‘}@font-face { font-family: 'secrcode'; src: url(‘}@font-face { font-family: tm; src: url(../Homepage2/fonts/tm.ttf);}h1{ color: black; text-align: left; font-size: 18pt; font-family: lekton005;}h2{ color: black; text-align: left; font-size: 18pt; font-family: secrcode;}h3{ color: black; text-align: left; font-size: 18pt; font-family: MarketDeco;}h4{ color: black; text-align: left; font-size: 18pt; font-family: Normat;}h5{ color: black; text-align: left; font-size: 18pt; font-family:Astronau ;}h6{ color: black; text-align: left; font-size: 18pt; font-family:Astri2 ;}#test{ font-family: tm; color: black; text-align: left; font-size: 18pt;}
  11. I have this really annoying problem with my webfont having different natural spacing on my Mac compared to the PC.Here's the difference: MAC: PC: As you can see the natural spacing is beneath the text on Mac and above on PC. The problem is cross browser. I've tried all kinds of css tweaking including line-height, padding, height of div; but as you can see the problem is apparently not in the css but in the font rendering itself.Anyone with a clue about this?Thanks!
  12. I'm using a ZooEffect Gallery, which is great-except for two things; A) The images do not read links-despite them being a gallery option. You can't seem to change the font within the gallery-I tried being adjusting the CSS-to no avail, I put it back and then after a few days, ZooEffect got back to me with a solution, Which also didn't work. Most people seem to be able to pinpoint these issues using Safari Developer or FireBug. Can anybody pinpoint for me or at least tell me how I would do this? ThanksLauren
  13. I'm trying to change the font of my blog title. Somehow, I'm screwing it up. I installed two web fonts, one to use as the title and one to use as the tagline. The font for the tagline works just fine. The title, however, won't take, it just keeps defaulting to serif. Here is why I'm lost: 1. I can use Cinzel (the font I want as the title) as the tagline and it works just fine. 2. I can change the title to Verdana (or any other random font), and that works fine, but when I try Cinzel, it goes back to serif. Anyone know what I'm doing wrong? Here's the blog. @import url(http://fonts.googleapis.com/css?family=Cinzel);@import url(http://fonts.googleapis.com/css?family=Parisienne);/*** header ***/#title-area #title {text-align:center; text-transform: uppercase;}#title-area #title a{font-family: 'Cinzel', serif;}/*** tagline ***/#title-area #description{text-align:right; font-family:'Parisienne', cursive; color:palevioletred; font-size: 20px;}
  14. Hi guys I'm Dave from Philippines Im a newbie in this forum and this is my 1t post... Well this is my question:ins this css code: I know that 11px and 1.5 em are both used in size attribute but the "/"(division sign) confused me. .What does this 11px/1.5 em do?Does it divide 11px/16px?'or what can anyone please explain I want to learn cSS!!! THANKS!!!
  15. I have 2 questions, but first the most ununderstandable for me at the moment(both questions got to do with the same class div): 1. The font with the text at the right side - the divclass "sidebox" is changing to a smaller zise when on another page eventhough i have the same css file, and the same class and "p" in the html file! Why is this? ompare the file index51.html with beachflag.html, and also the css wich i am attaching aswell. 2. What do i need to write in the css for the "sidebox1, 2, 3" classes for them to be on the some spot on every page? I have tried with position absolute, and also without position - and just with float:right; and margin settings, but it still changes on every different page. On beachflag.html for example the 3 boxes are shown much lower to the bottom then on the index. beachflag.html index51.html pse5.css
  16. Hi Everyone,Please find the attached "The Place.png" file. Could you please tell me the Name of that Font style?
  17. Hello, So I am fairly new to the developer world and I am dong this on my own (self taught). I have a friend who sent me a template design of something to put together, he also sent me the CSS and HTML code so i code use it in reference if I was stuck... I noticed in the CSS there is a lot of reference for value "museo-slab1" under then font property. What is this? Is this a type of font? I hope this question is clear enough to understand. being fairly new it is hard for me to know the right question to ask. Any help would be appreciated. Thanks Here is one of the lines of CSS that I found it in, hopefully this helps... font:normal normal 500 11px/21px "museo-slab-1","museo-slab-2",serif;
  18. Could someone take a look at the below code, and tell me why "<p class="rentalFleetText">" is inheriting a different CSS class. To be specific I think it's inheriting ".bottomRight p"?Being new to HMTL and CSS, my best guess is that I'm only allowed to have one font class per cell, or something weird, but honestly I have no idea.HTML: <!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>Sarasota-Tampa Express Homepage</title><link href="all.css" rel="stylesheet" type="text/css" /><script type="text/javascript">function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;}function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x;}function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}}</script></head><body id="theHeader" onload="MM_preloadImages('images/homeActive.png','images/about-usActive.png','images/route-and-scheduleActive.png','images/flight-informationActive.png','images/fareActive.png')" ><table id="headerTable" border="0" cellspacing="0" cellpadding="0"> <tr> <td id="logoBox"> <img src="images/Sarasota-Tampa-Express-Logo.png" width="205" height="75" alt="Logo" /></td> <td> <div id="rightsideHeader"> <p id="tagLine">We make things convenient for you! <span id="phoneNumber">Call Today! (941)366-6600</span></p> <div align="left" id="navigation"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','images/homeActive.png',1)"><img src="images/home.png" alt="Home" name="Home" width="82" height="33" border="0" id="Home" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('AboutUs','','images/about-usActive.png',1)"><img src="images/about-us.png" alt="About Us" name="AboutUs" width="110" height="33" border="0" id="AboutUs" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Route','','images/route-and-scheduleActive.png',1)"><img src="images/route-and-schedule.png" alt="Route & Schedule" name="Route" width="178" height="33" border="0" id="Route" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('FlightInfo','','images/flight-informationActive.png',1)"><img src="images/flight-information.png" alt="Flight Information" name="FlightInfo" width="184" height="33" border="0" id="FlightInfo" /></a><a href="thanks.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Fare','','images/fareActive.png',1)"><img src="images/fare.png" alt="Fare" name="Fare" width="70" height="33" border="0" id="Fare" /></a></div> </div> </td> </tr></table><table id="mainTable" width="1024px" height="174px" align="center" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="top" colspan="2" valign="bottom"><img align="middle" alt="Introductory Homepage Image" src="images/shuttlebus.png"><p id="welcome" align="left">Welcome to Sarasota - Tampa Express</p><p id="statement" align="left">Sarasota-Tampa Express offers regular daily round trip shuttle service<br>to and from Tampa International Airport.</p></td> </tr> <tr> <td id="bottomLeft"> </td> <td class="bottomRight" align="center" valign="top"><p>Rental Fleet</p><img width="552" height="140" alt="Rental Fleet" src="images/rental-fleet.png"><p class="rentalFleetText">Our limo vans get your big family from place to place.</p></td> </tr> </table> </body> CSS: .body { font-family: Verdana,Geneva,sans-serif;}.table { margin: 0; padding: 0;}.td { border-style: none; margin: 0; padding: 0;}img { border-style: none; text-decoration: none;}p {margin: 0px;}#theHeader { background-image: url("images/header-gradient.png"); background-repeat: repeat-x; margin: 0;}#headerTable { height: 150px; margin-left: auto; margin-right: auto; width: 1024px;}#logoBox { padding-left: 50px; width: 268px;}#tagLine { color: #FFFFFF; font-family: Verdana,Geneva,sans-serif; font-size: 16px; font-style: italic; height: 45px; margin: 0; padding-top: 35px; text-align: left; width: 706px;}#rightsideHeader { height: 150px; margin-top: 0; width: 624px;}#phoneNumber { padding-left: 100px;}#navigation { height: 70px; width: 706px;}#mainTable { background-image: url("images/background-gradients.png");}.top { height: 174px; margin: 0; overflow: hidden; padding: 0; width: 1024px;}.top img { float: left; margin-right: 15px;}#welcome {color: #C34306;font-family: Arial,Helvetica,sans-serif;font-size: 28px;font-style: normal;font-weight: bold;height: auto;text-shadow: 2px 2px 15px #4F4F4F;width: 1024px;text-indent: -37px;margin-bottom: 45px;margin-top: 0px;margin-right: 0px;margin-left: 0px;}#statement { color: #000000; font-family: Arial,Arial,Helvetica,sans-serif; font-size: 14px; font-style: normal; font-weight: bold; height: auto; margin: 0; width: 1024px;}#bottomLeft { height: 440px; width: 406px;}.bottomRight { height: 440px; width: 618px;}.bottomRight p {font-family: Arial, Helvetica, sans-serif;font-weight: bold;font-style: italic;font-size: 19px;text-align: center;}.bottomRight img {margin-top: auto;margin-right: auto;margin-bottom: -36px;margin-left: auto;}.rentalFleetText {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-weight: normal;width: 160px;}
  19. I'm trying to get these sliders to work so a user can adjust the readability of the website. i have a slider to adjust the font size, the number of colums and the background color. For the background color i want to have some sort of color picker but i still need to look into that but if you have any suggestions please let me know! here's the code: //fontsizewindow.onload = function() {var value_display = document.getElementById("value_display").className.class="value_display";var lorem = document.getElementsByClassName("lorem");document.getElementById("slider").onchange = function() {value_display.value = this.value;lorem.style.fontSize = this.value + "em";}}//kolom aantalfunction changeColumnNoSlider(event) {var val = event.target.value;document.getElementById('columns-no-value').className='columns-no-value'.textContent = val;var el = document.getElementsByClassName('kolom');el.style.webkitColumnCount = val;el.style.MozColumnCount = val;} The problem is that i use it for blog post so it's not just one article i want to adjust. the code works if i use .getElementById but i need to use classes. Thanks in advance!
×
×
  • Create New...