Jump to content

Search the Community

Showing results for tags 'w3.css'.

  • 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

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

  1. Noob here. I have been playing around with W3.css, in particular the w3-row-padding, however I would like to set up five columns, with some padding. Can anyone advise me how I might go about this (I'm guessing it will involve nesting some containers?) Many thanks.
  2. First of all, I am sooo new at this and if I am to learn I need to understand why things behave the way they do. I am using W3.css only in this test (copying a little here and a little there) and my problem is that when looking at it in the browser, the grey box with CAPITALS (the first div) is covering up the first div in sections, the title London does not show. 1, Why? It must have something to do with w3-top because if I delete that, the CAPITALS will not cover London. But of course it is no longer stuck to the top. 2, What is the solution? I added an empty div (<div cla
  3. Hello... I am trying to design a sticky header bar for my project. While I have already got the sticky bar working, I am now trying to create a better layout of the content on the bar using CSS (w3.css or standard css). I cannot figure out how to achieve this. Any suggestions? What I would like to have (w/out the borders) is: <table style="width:100%"> <tr> <td rowspan="3" width="50%"> <img src="img_lights.jpg" style="height:70px;width:350px" alt="logo_plc_holder"> <h3>PageTitle</h3> </td> &
  4. I believe it's a pretty common observation that the w3-top class of w3.css works by hiding the page below. It seems to me that the default solution is to add some <br> , or setting a margin on the top of the page. That's good enough for layout, but that doesn't help if you use bookmarks with id: when you follow a link from an element with <a href="#example">, this will show the <div id="example"> on the very top of the page, where it will be covered by the w3-top class. I know it's a bit silly and not a huge problem but I'd like the user to get to read the bookmark
  5. 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.
  6. I have been going through the w3.css documentation and see many things I like. However, the tooltip https://www.w3schools.com/w3css/w3css_tooltips.asp page is different from what I expected. To me, a tooltip is as described on https://en.wikipedia.org/wiki/Tooltip - when you hover over (mouse over) an item a bubble appears with some text in it. Even when writing this post, there is a tooltip saying "Enter your text". But when I hover over "is the capital" in the w3.css tooltip "London is the capital" example, the text "(9 million inhabitants)" instead pushes the following text to the right to
  7. How popular is w3.css framework currently? In other words, about what percent of websites use it? w3.css seems good, and I like w3schools a lot. Thanks
  8. I just started using w3.css. I noted that in a summary/details block the arrow to click open or close is not shown any more. By inspecting the w3.css file, I discovered that the statement "summary {display: block;}" causes the disappearance. As work-around I removed it, without visible side-effect. My question: is there an alternative way to get an arrow in w3.css?
  9. hi there... i use the dot slideshow indicator with the carousel code for automatic advance images, but canĀ“t make points changes togheter with the image changes with the code... any ideas? sorry about my english.... here is the code... thanks in advance. <header class="w3-display-container w3-center" id="home" style="padding-top: 150px"> <div class="w3-content w3-display-container" style="max-width:800px"> <img class="mySlides" src="img-1.jpg" style="width:100%"> <img class="mySlides" src="img-2.jpg" style="width:100%"> <img c
  10. Hello everybody, I was playing with a template from the w3.css templates from w3 schools and found an issue that I can't get around. In the template called Parralax template or the forth one from top, with the man with grey hat, I saw that the home screen image was loaded from the css .bgimg-1{ min-height: 100%; background-image: url(/w3images/parallax1.jpg); } (from the style brackets after the head tag ) I wanted to do a transition between two images but only found examples on the web that it is possible only when the image is loaded from an html imag
  11. Hi, I searched the forums but haven't found an answer about this. I have created a simple eBay template based on w3.css inline style sheet. When I paste into the eBay form it passes checks and the mobile test also works. When I publish the advert, however, the images in Chrome, IE, Firefox (latest versions) all are fixed at original size. If I browse from my mobile phone, however, the resizing works well and appears as intended. Any idea why it doesn't work on desktop browsers? Advert is here: https://www.ebay.co.uk/itm/202385270343 and the template I created: <
  12. When you add a form that is modal and view on a mobile device (apple mostly) the background still scrolls with your finger. This creates a problem as the form fields (Inputs) do not line up and it almost impossible to edit or add text to input fields as you cannot select them. To reproduce just run the modal login example on your mobile phone and move your finger then try to add text to the input fields - !
  13. Hi everyone, I borrowed part of the Marketing / Website Template (W3.CSS), specifically the <!-- Work Row --> portion. It looks fantastic, but according to the device browser, (specifically phones and tablets) when in "landscape" mode, the "w3-card" divs have different height according to the text. I've been trying for days to find a solution - flexbox, w3-cell, pseudo-elements - mostly way above my understanding, and nothing has worked so far. Wouldn't be surprising if I've found a valid solution and mucked it up because of my inexperience Anyway, here's the code fro
  14. I have some W3.CSS accordions on a webpage based on this tutorial. They work fine, but I'd like to change the button text too (not just show/hide the div) When shown, I'd like the button to show "Click for details". When hidden, I'd like the button to show "Hide details". Thanks in advance for any assistance/advice you can give me.
  15. Text in input field isnt visible. I'm trying to create a nav with an input field using w3.css. When I input text, nothing comes up. And also how do I remove the hover effect in w3.css? Thanks a lot
  16. if i want to use a free ws.ccs website templates, do i have to keep it linked to the w3 site and the other sources i.e. cloudflare? or can i download the source files i.e. ( <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> ) and rename them to my servers? thanks
  17. Hi, I need to reference the w3.css stylesheet on a server for a competition (building a website is required and we want a good looking one, but we can't have the stylesheet reference a link it has to be on the server). When I went to download the css the link provided me with a page filled with a bunch of code that I couldn't fully understand, but it did not download any files. Anyways I simply don't know what I'm doing and would appreciate some help on this. Thanks
  18. sue

    W3.css Tabs

    Hi, I am using the w3.css tabs and have a customised cursor. However the cursor will not work over the tabs. What do I need to set to get it to work over the tabs also?
  19. 1. Glad that there is no conflict of w3.css with bootstrap. 2. But materialize.css ruins w3.css which also disturbs my mind. Lets build our own conflict free materialize css or some edits to w3.css 3. Wappalyzer doesnt recognize w3.css as a technology. Please help me work on these.
  20. hello, new user of w3.css here... I'm trying to create a navigation bar with dropdown elements. If the dropdown is the first element in the bar, it is always highlighted, as if you'd hover over it, and it keeps that state. Example (from the try-editor, just change the order of elements so that w3-dropdown-hover is the first one) <!DOCTYPE html> <html> <title>W3.CSS</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> <body> <div class="w3-c
  21. Jorgensen

    w3.ccs -

    hi i'n new here - i have done homepage designs on and off for the last twenty as a hobby (i'm no a programmer), mostly using serverside php and the tabels for building the side at clientside. it's now time to update the company site, and that the mobiles has come into the scene i have searched the net to find out how to set flexible sites, and i'ts my impression that i can do a lot with w3.css. but as this is all new to me i have got some problems / questions. i use a <div class="w3-row"> to display some items, and every item is in their own <div class="w3-col
  22. The intro to w3.css says "Uses standard CSS only (No jQuery or JavaScript library)" which is technically true but a bit misleading. Javascript must be enabled in the user's browser in order to use useful features like modal popups. What's the big deal? Someone might create a website using a modal popup for users to register or purchase things, only to find that visitors using screen readers because they're visually impaired can no longer participate or buy things. So the site is no longer fully accessible, which is illegal in some countries and some class action lawsuits have already happ
  23. I've been building my website for the first time using w3.css 4 - which I think is brilliant by the way. Makes things so much quicker. However, I've been wondering... when building a drop-down menu (like below) is there any requirement to include <ul> and <li> tags, even though the menu works and displays perfectly just using the w3 classes. I am guessing that it's most prob good practice to include the <ul> tags for search engine crawling purposes, but if anyone can shed any light on whether the these tags are actually required, I would appreciate it. Cheers.
  24. I'm editing this template: https://www.w3schools.com/w3css/tryw3css_templates_clothing_store.htm All the links in the left menu point to the same page, like this: <a href="#" class="w3-bar-item w3-button">Dresses</a> However, when I try to point to a new page, like this: <a href="w3test01.html" class="w3-bar-item w3-button">Test</a> then the new page covers the menu as well. How can I make new pages appear behind the menu, like the original page? All the W3.CSS templates only use one page. Thanks for any help!
  25. Does anyone have any suggestions, or can help me with the following please: I am using w3.css for the first time, but I am struggling to line-up google icons with the text (using the w3-bar-item and w3-button classes) in my navigation bar. I have tried adding my own css (relative positioning, padding-bottom/top, and even changing the font size of both icon and text) but nothing seems to work. I have also gone through w3 references, but can't find the appropriate class that might make the icons and text line up properly. Any help would be very much appreciated. <div i
×
×
  • Create New...