Search the Community

Showing results for tags 'w3css'.

More search options

  • 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


  • Community Calendar




Website URL








Found 7 results

  1. Hello. Basically I'm transforming my websites to use W3CSS as above (using the grid system) Ive got 1 subdomain all set up & its all go - Eveything working fine... however I am now working on a 2nd subdomain - ive copied the same w3.css file over to the second css directory... (i may put it in a global directory later on, so all my subdomains can access it..) Anyway, Im using the grid system, and also following the "try it yourself" area and all i get is 2 or 3 'grids' on top of each other - not side by side.... Is there a way / trick to make a container go the full width of the screen, & each div in a row stay on the same row. (i'll also put a background color to it... - for the entire row..) it seems strange, as my initial / first subdomain using this W3CSS was very easy. i did have problems but they were fixed within minutes.. ive been trying to fix this 1 page for about 30 minutes now & i cannot get it to go side by side.... (its getting late, i'll tackle it tomorrow) Ps - This one page uses a separate header file to the rest of the subdomain. (once i get it going, i'll have just 1 header template) Find M3 & you'll find the header line i'm trying to alter.
  2. Hello, I have the problems that when i use a link in a w3css Navbar, the link is at the top of the bar. What i have when i write everything in a single entry: Code: <div class="w3-bottom" style="margin-right: 20%"> <ul class="w3-navbar w3-red"> <li> Powered by <a href="" title="w3css"> w3css </a> and <a href="" title="fontawesome"> fontawesome </a> </li> </ul> </div> What i have when i write it in single entrys: Code: <div class="w3-bottom" style="margin-right: 20%"> <ul class="w3-navbar w3-red"> <li> Powered by <a href="" title="w3css"> w3css </a> and <a href="" title="fontawesome"> fontawesome </a> </li> </ul> </div> What i will have: I hop you can help me //Cripi
  3. I'm using W3.CSS tabs and I have a class assigned so that the active tab is colored. However, when the page loads none of the tabs are open. I have to click on one. I'm wanting the 1st tab to be open and highlighted with the active color when the page is first loaded. Here's my code: <ul class="w3-navbar w3-grey"> <li><a href="javascript:void(0)" class="tablink" onclick="openTab(event, 'tab1');">TAB 1</a></li> <li><a href="javascript:void(0)" class="tablink" onclick="openTab(event, 'tab2');">TAB 1</a></li> <li><a href="javascript:void(0)" class="tablink" onclick="openTab(event, 'tab3');">TAB 3</a></li> </ul> <div id="tab1" class="tab"> <p>Tab 1 content</p> </div> <div id="tab2" class="tab"> <p>Tab 2 content</p> </div> <div id="tab3" class="tab"> <p>Tab 3 content</p> </div> <script> openTab("tab1") function openTab(evt, tabName) { var i, x, tablinks; var x = document.getElementsByClassName("tab"); for (i = 0; i < x.length; i++) { x[i].style.display = "none"; } tablinks = document.getElementsByClassName("tablink"); for (i = 0; i < x.length; i++){ tablinks[i].className = tablinks[i].className.replace(" w3-red", ""); } document.getElementById(tabName).style.display = "block"; evt.currentTarget.className += " w3-red"; } </script> Thanks!
  4. To the developers of W3.CSS thank you so much for creating a platform that in my opinion, uses less code to create a web responsive site with bells and whistles built in. I had hand coded a webpage template, but now that Google won't rank your site properly unless it is responsive, thus my template goes by the way of the 8-track. W3 provided the coding to make sites responsive, but that was still more time that I didn't have. Then, came W3.css now I can replicate my template using W3css, THANK YOU! my original template used layers via z index, placement via <div>, and in page css. My query is what is the proper syntax and use for z index within W3.css and within the container, and can multiple layers be used with a container? also can background images be used within W3.css? I see you have colors, what about images? also can the rollover feature within W3.css be used with custom images, and for non menu? based on replies, I will update your free template accordingly. Thanks once again
  5. Hello. Ive recently joined this forum. a week or so ago I found the W3CSS pages & they are great. Ive found the HTML / CSS code for pagination, & i thinki want to use it, however I am a bit puzzled. example: <li><a href="#">2</a></li> <li><a href="#">3</a></li> can anyone advise what else is needed to use this system ? How does my website KNOW if i clicked page 1, page 2, or page 3 ? all the targets point to a hash-tag # Basically my main site runs on PHP, so i would appreciate any assistance in understanding a) how the script / website knows what value is selected how to pass this value to a php script as named value. - Eg $page Also - it would be good if the pagination page be updated to point to a few tutorials. Thank you.
  6. Why is the next code not responsive? I mean, if I make the screen smaller, the columns will stay horizontally. Or see the example on w3schools: Also this example seems to be non responsive. <div class="w3-row"> <div class="w3-col" style="width: 40%; background-color: silver"> <p>[w3-col 40%]Lorem ipsum dolor sit amet.</p> </div> <div class="w3-col" style="width: 40%; background-color: green"> <p>[w3-col 40%]Lorem ipsum dolor sit amet.</p> </div> <div class="w3-col" style="width: 20%; background-color: red"> <p>[w3-col 20%]Lorem ipsum dolor sit amet.</p> </div> </div>
  7. Hi there,Love the W3CSS for a lightweight material design and easy responsiveness. Working on it for few days and thinking to contribute.So here is my thought for using .w3-spin class to spin something mostly the icons in reverse direction. I fork this spin class to .w3-spin-reverse which is working perfectly for a spin in reverse direction. .w3-spin-reverse {animation:w3-spin-reverse 2s infinite linear;-webkit-animation:w3-spin-reverse 2s infinite linear}@-webkit-keyframes w3-spin-reverse{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-359deg);transform:rotate(-359deg);}}@keyframes w3-spin-reverse {0%{-webkit-transform:rotate(0deg);transform: rotate(0deg);}100%{-webkit-transform:rotate(-359deg);transform:rotate(-359deg);}} Check out the demo @ this might help improve this beautiful framework work other folks who really love this.Thanks.