Jump to content

Search the Community

Showing results for tags 'browsers'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


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

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








Found 10 results

  1. Dear all: Below is how we can collapse and uncollapse a block of text suitable for FAQ or other similar effects, using HTML5. It seems it is supported by Chrome so far. The browser, however, will automatically highlight the output of the <summary> tag with a box. Is there a way of removing such box? Thanks. <!DOCTYPE html> <html> <body> <article class="collapsible_faq"> <details> <summary>Why do You Operate this Type of Business?</summary> <p>This is a feature of collapsing and uncollapsing a block of text using HTML5. It is just supported by chrome so far and Safari has started working on it. You should click on the little arrow to the left to collapse and uncollapse the text. </p> </details> <details> <summary>In Which Countries Do You Presently Work?</summary> <p>This is a feature of collapsing and uncollapsing a block of text using HTML5. It is just supported by chrome so far and Safari has starting working on it. You should click on the little arraow to the left to collapse and uncolapse the text. </p> </details> </article> </body> </html>
  2. Dear all: I would appreciate if one can explain how I can practically test what my website will look like in a cell phone or tablet prior to launching it.
  3. Hello Everyone, I'm fairly new to web design and the new site I'm working on looks awesome in safari but when I open it in internet explorer it's all screwed up. I didn't know if there was an easy way to make everything the same across the board? If not, what is the easiest/best way to do go about making sure they are all the same? Thank You!
  4. Hi, I am having trouble with the page bottom of my website. It is not showing consistently when viewed in different browsers. Chrome and internet explorer seem to be pretty similar, however in safari the information sometimes spills over the page bottom. What is the best way around this? Do i need to get some kind of code to get the different browsers to respect the spacing on my page? Please have a look at: http://www.mygraphicdesign.com.au/pagebottom/faq/index.html What can i do to make this display correctly at the bottom in the different browsers! Another page is: http://www.mygraphicdesign.com.au/pagebottom/index.html As an example Dont look at the other pages as they are the old site. The two posted above are my new site so only for these two pages please. The only solution i have thought of so far was to make the page bottom really really big so that at least it does not get cut off on some of the browsers, but it doesn't really look that great =( Please help!!!! I have no idea how to fix this!!!
  5. Gerbrandd

    Aligning <div>

    Hello, I'm experiencing a little problem when trying to align different div sections. The page loads correctly in Safari/Chrome but when using other browsers, there is a little displacement (see image). I don't know what is causing the problem. Hope anyone of you can help me. Thanks in advance! <html><head>(...)<style>body{background-color:rgb(235,235,235);}.header{background-color:rgb(17,76,131);position:absolute;top:0px;left:0px;right:0px;height:120px;}.base{background-color:rgb(250,193,37);margin:auto;padding-bottom:15px;width:980px;padding-top:125px;height:auto;text-align:center;}.tabbed_box{margin:0px auto 0px auto;width:950px;}.tabbed_area{border:1px solid #494e52;background-color:#636d76;padding:8px;}ul.tabs{margin:0px;padding:0px;margin-top:5px;margin-bottom:5px;}ul.tabs li {list-style:none;display:inline;}ul.tabs li a{background-color:#464c54;color:#ffebb5;padding:8px 14px 8px 14px;text-decoration:none;font-size:9px;font-family:Verdana, Arial, Helvetica, sans-serif;font-weight:bold;text-transform:uppercase;border:1px solid #464c54;}ul.tabs li a:hover{background-color:#2f343a;border-color:#2f343a;}ul.tabs li a.active{background-color:#ffffff;color:#282e32;border:1px solid #464c54;border-bottom:1px solid red;}ul.list{list-style-type: square;font-family:"Segoe UI", sans-serif;font-size:14px;}.content{background-color:#ffffff;padding:10px;border:1px solid #464c54;text-align:left;font-size:12px;font-family:Verdana, Arial, Helvetica, sans-serif;}#content_2,#content_3,#content_4,#content_5,#content_6,#content_7,#content_8,#content_9 {display:none;}</style></head><body><div class="header">Test?</div><div class="base"> <div id="tabbed_box_1" class="tabbed_box"> <div class="tabbed_area"> <script src="js/functions.js" type="text/javascript"></script> <ul class="tabs"> <li><a href="javascript:tabSwitch_2(1,9,'tab_','content_');" id="tab_1" class="active">Ligging</a></li> <li><a href="javascript:tabSwitch_2(2,9,'tab_','content_');" id="tab_2">Faciliteiten</a></li> <li><a href="javascript:tabSwitch_2(3,9,'tab_','content_');" id="tab_3">Logies</a></li> <li><a href="javascript:tabSwitch_2(4,9,'tab_','content_');" id="tab_4">Eten & Drinken</a></li> <li><a href="javascript:tabSwitch_2(5,9,'tab_','content_');" id="tab_5">Sport</a></li> <li><a href="javascript:tabSwitch_2(6,9,'tab_','content_');" id="tab_6">Animatie</a></li> <li><a href="javascript:tabSwitch_2(7,9,'tab_','content_');" id="tab_7">Kinderen</a></li> <li><a href="javascript:tabSwitch_2(8,9,'tab_','content_');" id="tab_8">Extra</a></li> <li><a href="javascript:tabSwitch_2(9,9,'tab_','content_');" id="tab_9">Prijzen & Contact</a></li> </ul> <div id="content_1" class="content">Content for Tab 1</div> <div id="content_2" class="content">Content for Tab 2</div> <div id="content_3" class="content">Content for Tab 3</div> <div id="content_4" class="content">Content for Tab 4</div> <div id="content_5" class="content">Content for Tab 5</div> <div id="content_6" class="content">Content for Tab 6</div> <div id="content_7" class="content">Content for Tab 7</div> <div id="content_8" class="content">Content for Tab 8</div> <div id="content_9" class="content">Content for Tab 9</div> </div> </div></div></body></html>
  6. Sorry if this may have been answered before but I could really do with a specific answer to a specific set of circumstances. I am very new to anything other than basic css.The best way to describe what I mean would be to look at the site in various browsers. http://www.livingwithaddicts.com/ .I have put this together for a charity using the Joomla CMS (version2.5). If you look at the site in Firefox it is as (for now as it ain't finished) how it's meant to look. It's fine in Chrome and passable apart from some easily solvable positioning issues in Opera. Then we get to IE and I have just added background:#485fc5; to get it to render partly as i wanted and will do the same to get the bg on the forms. I would like to explore some other ways of styling so it looks acceptable in IE. I don't want to go down the route of replacing gradients or text shadowing with graphics. Is there away of having a set of CSS that is only called if someone views in IE? If so how can I do this? Is this what's known as a hack? Other possibilities are that as I am using Joomla, I have had to put some inline styling into specific content and I think some of the generated code might either be depracated and/or a bit messy. Would this affect how it renders. Also I hurriedly (lazily) c& p'ed a chunk of css and modified the hex values to incorporate it in my existing css.(To anyone now sighing with disapproval, I apologize) This may not be the up to date syntax and I only heard of webkit the other day so that's what a novice I am. I will paste it here and hopefully not embarrass myself to much. If anyone fancies a look (or a laugh) then please do. I would really appreciate any advice. Here's the the code. I will attach screenshots to demonstratebody { background: #485fc5; background-image: linear-gradient(bottom, #485fc5 13%, #6e86ee 57%, #a0b0f5 79%); background-image: -o-linear-gradient(bottom, #485fc5 13%, #6e86ee 57%, #a0b0f5 79%); background-image: -moz-linear-gradient(bottom, #485fc5 13%,#6e86ee 57%, #a0b0f5 79%); background-image: -webkit-linear-gradient(bottom, #485fc5 13%,#6e86ee 57%, #a0b0f5 79%); background-image: -ms-linear-gradient(bottom, #485fc5 13%, #6e86ee 57%, #a0b0f5 79%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.13, #485fc5), color-stop(0.57, #6e86ee), color-stop(0.79, #a0b0f5));}
  7. My page does not view correctly in other web browser than Firefox.I want the page to have a "book/magazine" design, where you flip to the next page in HTML. I managed to get the design i wanted, but when i view my page in other browsers, it does not look like it does in firefox. Here is the page I am talking about -open in Firefox for correct view, and then try safari/chrome/opera. Why is it like this?http://www.ia-stud.h...strate/inn.html Here is the source-code:<html><head><META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=utf-8" /><META NAME="COPYRIGHT" CONTENT="© Ole Andersen, Sun Feb 26 22:43:51 CEST 2012" /><title>Ole Andersen</title> <style type="text/css">a:link {text-decoration: none;COLOR: inherit;}a:visited {text-decoration: none;COLOR: inherit ;}a:hover {text-decoration: none;COLOR: 778899 ;}a:active {text-decoration: none;COLOR: inherit;} img{ margin-right:0px;}</style> <style>#huskelapp{ position:absolute;background-color:#FFFFFF ;border-top-right-radius: 20px;border-top-left-radius: 20px;border-bottom-right-radius: 20px;border-bottom-left-radius: 20px;padding-left: 10px;padding-top:5px;padding-right:4px;padding-bottom:5px;left:240px;height:1110px;width:817px;top:130px;opacity:0.6;filter:alpha(opacity=60);z-index: 0;overflow: hidden;float:left;overflow: hidden; } <!--#wrapper{margin: 0 auto; width: 680px; background-image:url('images/pages.png'); height:601px;}--> #wrapper{margin: 0 auto; width: 1070px; height:601px;} #left{height:540px;width:470px;padding-left: 40px;padding-top:40px;padding-right:40px;padding-bottom:40px; background-image:url('images/inn.png');float:left;} #right{height:540px;width:470px;padding-left: 40px;padding-top:40px;padding-right:40px;padding-bottom:40px; background-image:url('images/right.png'); overflow: hidden;} html{ background: url(images/pages.png) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} </style> </head> <body> <div id="wrapper"> <div id="left"> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <center><font color="#000000" face="futura"><font size="1">2 - <a href="index.html">Forrige Side</a> </font></center></div> <div id="right"> <table align="left"><tr><td> <br><font color="#000000" face="futura"><font size="1"> </font></td> <td> <font color="#000000" face="futura"><font size="1"> </td></tr></table> <br><br><br><br><br><br><br><br><br><br><br><br><br><center><font color="#000000" face="futura"><font size="1">3 - <a href="1-2.html">Neste Side</a></font></center> </div> <!-- END of #wrapper div --></body> </html>
  8. Hello internet. What is the best way to check my website in different browsers? I have IE and my Firefox and Safari friends are pointing out issues with how their browsers render my code.
  9. Hi,I´m new in this forums.Does anybody know how to really make a website look the same in all browsers?Maybe its impossible, but are there ways to even try?Thanks
  10. Hi I've used W3Schools for a good few years and find it the best educational tool for HTML and CSS. Thanks guys! I was really pleased to discover recently that you have forums, too. I have a problem with the display on my wife's site, which appears to only manifest itself on IE7 (and earlier). The display is as intended on IE8, IE9, Firefox, Safari and Chrome. My concern is obviously for those using IE browsers older than IE8. The site itself (in its current format) was originally built about five years ago, when my knowledge was confined to the use of tables for layout as opposed to using divs and css as I would now; were I to built the site from scratch. Because there are hundreds of photos on the site, I've never had the inclination to re-code it. The Home page, at least, validates - with the exception of a marquee banner, which I know will never validate. The URL is as follows: http://www.hillsntoes.co.uk/ - the css (if required) can be found at: http://www.hillsntoe...ayout/style.css . There are two problems - the first of which is critical. My horizontal menu bar does not display at all in IE7, thus making navigation (almost) impossible. The second problem relates to placement. Line spacing (both on the 'Home' and 'Zumba' tabs) where I'm using the sign for a registered trade mark (coded "®") is "squashed". Additionally, the placement of the 'Zumba Romford' and 'ZIN' logos on the 'Zumba' tab are vertically displaced downwards by about 60px. To reiterate; neither of these problems occur in other than IE7 and earlier (certainly in IE6 - I don't have access to anything earlier). The problems seem to occur irrespective of Windows platforms (tried on XP, Vista and 7). If anybody can shed any light on why I'm getting these problems, I'd be very grateful. Thanks and regards Webbo
  • Create New...