Jump to content


  • Posts

  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

sarahfoxnz's Achievements


Newbie (1/7)



  1. Ive fixed it - I haad a DIV w3-container, & then a second div for the menu code. I removed the w3-container div & included it in the menu div.. FIXED
  2. Hello. Im convertig anold site to W3-css & started on one page.. (i'll update the other pages soon). http://sudoku.kwister.com/main?file=2020041310 The problem is, that the black menu at the top looks like 98% of the screen-width on a PCC / computer, & the yellow title above it, is 100% wide. HOWEVER, on the ipad - the black menu is 100% of the ipad width, but the yellow title, is OVER the width (making the ipad have a left/right scrollbar - or able to move sideways). When i first tried to upgrade/fix this page (or page template), I had the w3-row and w3-mobile on the 3 div areas (menu, main content & right-text). According to the w3-css website, The sections should be above one another on small (ipad) screens. Though the main Sudoku board overlapped the right-side text & didnt stack.. Am i forgetting one essential piece of code ?
  3. Ive worked it out . added the following classes to the CSS, .w3-reverseopac{opacity:0.54} .w3-reverseopac:hover{opacity:1.00} (reverse opacity) and on the main template <td class="w3-red w3-reverseopac"> Text to include </td>
  4. https://www.w3schools.com/w3css/w3css_effects.asp Hello. I'm wondering if there is a REVERSE of the hover effects. Currently i've got it on w3-hover-red - changing it to a red background if i hover over a div area. But what i'm after is to put 3-4 divs side by side (i can do this) - but have them using grayscale or opacity as default, and when i hover over the divs, it will display "normal" (not grayscale/opacity), has anyone tried this technique ?
  5. Ive worked it out div class="container w3-center-align" style="width: 50%; margin:auto;"
  6. https://www.w3schools.com/w3css/w3css_panels.asp Hello. I'm trying to make a panel - this works, however it takes up 100% of the available width. Is there a way to make the panel A ) auto-adjust to the content of the text, and/or B ) a specific width - eg 50% (of the available width of div - NOT 50% of the screen-size...)
  7. FIXED IT. Ive removed the w3-hide-small class and added the style - display: none; <div id="menu1" class="w3-cell-row w3-hide-large w3-hide-medium" style="width:75%; display: none;">
  8. Thank you - That part worked. Ive fixed 1-2 other things as well, but Im baffled as to my next problem. If i click on the button - It does hide the menu - which is good. But it does not make the 2nd div "menu1" visible. so the mobile-phone user cant make the menu re-appear. (though if they go to another page - the top menu does reappear.. ) .. i may do cookies so the option carries forward.
  9. I started to follow the https://www.w3schools.com/w3css/w3css_navigation.asp navigation page. However the menu I want required a bit more - with a few SELECT fields and a form. My page is here :- http://newtib.kwister.com/ The menu at the top (marked in HTML code as <!-- NEW MENU --> works fine. On big/medium screen - it is the same, However on a small screen (mobile) I see a small button which says "HIDE MENU". This is OK. & when I press the button, the menu hides itself. PROBLEM: within 1-2 seconds of pressing the button, the menu reappears. I am wondering if someone can assist with finding a problem with the script ? (on a mobile). if Div is hidden, show it it if Div is visible, Hide it I have TWO divs (one underneath). Which shows another button. If one div is hidden, the other div is visible. its supposed to swap when the buttons are pressed..
  10. yes - My host apparently stops scheduling at various times & dont notice anything until someone mentions it. Late last night I fixed it, with this code (not css - sorry). (code is wonky on this screen) <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> <script type="text/javascript"> var myVar = setInterval(myFunction2, 35000); function myFunction2() { $( "#myID" ).load( "/content.php", function() {}); } script.onerror = function() { alert("cannot load script"); } </script>
  11. <div class="mySlides w3-container"><a href="/todo#feedback" class="w3-bar-item w3-button w3-mobile">Feedback</a></div> <div class="mySlides w3-container"><a href="/todo#feedback" class="w3-bar-item w3-button w3-mobile">Contact us</a></div> Hello - Stupid question - How do i remove all formatting on this forum ? the above is copied from my html code & it looks weird - i cant remove the blank space / gap. (it also appears that this box where im typing is 50% of the available size, it word-wraps much sooner than i want. When i type, i like plain text with no formatting of any description. MAIN QUESTION:- https://www.w3schools.com/w3css/w3css_slideshow.asp I'm using the carousel() function. I have successfully used the carousel in another website Ive done (just simply swap between two phrases / words). However this time, I want to activate / run a PHP script. I do not need the PHP results to be displayed on screen - I just need it to run every few minutes or so. Ive researched ajax, php, javascript etc & copied the code from my other script. my text in the div does rotate, however i just cant get the php script to activate. ive used content.php /content.php and even http://mysite.com/content.php The bad thing too, is theres no error / result / error messages of any kind. i dont even know if its checking the correct path to find my script (maybe its checking a different / incorrect path. has anyone got assistance to activate a php script every xx seconds ? (once i get it going, i can change things). All the php script does is display/echo the time() value, & also save the time to a file. I'll remove the echo part once i get it going, as i dont need anything displayed on screen. I'll change the php script once its working
  12. FURTHER: Examining the css file, w3-half and the other sizes, are all FLOAT LEFTS. So even if you want it centered, it wont center. I guess i'll have to create my own extra CSS. FIXED. I've added 2 new css classes - By-passing the float lefts. Would this be useful to add to the "master" file ? (i'm sure you can add various sizes - quarter /third etc...) .w3-table-center{margin-left:auto;margin-right:auto} .w3-table-half{width:49.99999%}
  13. Ive checked & downloaded a fresh copy of the latest CSS (my one did not have w3-auto. ) Ive now got w3-auto, and use this (removing my excess divs) <table class="w3-table-all w3-border w3-half w3-auto"> However its left-aligned. The auto option does not work on tables.
  14. There MUST be an easier way than this - But ive figured it out. Why have so much HTML code to do such a simple task ? Ive got 4 additional divs just to "center" a table within an EXISTING div. Why ? (ALSO: you need to do the w3-quarter / w3-half BEFORE the w3-content. i tried putting them after ( w3-content w3-half ) , but it didnt work. <div class="w3-row"> <div class=" w3-quarter w3-container"></div> <div class="w3-half w3-container"> <table class="w3-table-all"> (Table rows / content) </table> </div> <div class="w3-quarter w3-container"></div> </div>
  15. Hello. Is there an EASY way to have a w3css table that is centered & a variable width. IE not taking up 100% of the available div width. Ive currently got this code - it is a small width - but it still floats to the left of the screen. <div class="w3-row"> <div class="w3-half w3-container" style="margin-left:auto; margin-right:auto;"> <table class="w3-table-all" style="margin-left:auto; margin-right:auto;"> Ive tried with or without (rows, w3-centered, w3-center) - & nothing works, ive added (& not added) the css styles as well. This website does not contain any information about reducing the horizontal width or the ability to center a table. (all the examples shown, display a table at 100% of the available width). Does anyone here have the ability to add a few more examples to the site: https://www.w3schools.com/w3css/w3css_tables.asp
  • Create New...