Jump to content

melahi

Members
  • Posts

    19
  • Joined

  • Last visited

Everything posted by melahi

  1. It works fine for me, but I suspect you may have tried it a few times and the likely problem is as follows: css files are cached by your browser, so when you update it, the browser carries on using it's out-of-date copy. You have to go into your browser toolbox and find the option to clear the cache then when you reload it will get the new version, but keep in mind it will carry on using that until you clear the cache again!
  2. It's not clear what you are trying to achieve. The main reason for limiting width of things is that it's tiring to read long lines. There are several practical solutions: When the screen gets wider you can select column-count which is how news papers used to tackle this issue. A simpler solution is to set a max-width, but an alternative might be to specify font-sizes in vw units (vertical width) thus simply making the text bigger. Can you explain what you are trying to solve?
  3. Sorry... wrong link. it's here: http://ngaro.online/z.html (note: test-pc, is my offline server) - my bad! 😳
  4. do...view source and save it, then edit that and add a style section at the end of head I added the following to a clone of this page: <style> body { max-width:600px; color:red; background-color:#404020; margin:auto; } </style> and this is the result: http://test-pc/z.html feel free to ask if it's not clear what I did!
  5. I'm not entirely sure what you are trying to do, but there are several errors in your HTML. Here is how I would rewrite it. Feel free to ask for explanations if you don't understand. Also you can submit your HTML to the w3 validator... it's here: https://validator.w3.org/nu/#textarea <!DOCTYPE html> <html style="background-color:#C0C0C0;padding:0;margin:0" lang="en"><head> <style> body { margin:20px auto 20px auto; color:red; max-width:40em; } #boxes { height:auto; overflow:auto; background-color:white; } #boxes .box{ float:left; text-align: center; width:30%; padding:10px; } #boxes .box img{ width:90px; } </style> <title>HTML test</title> </head><body><section id="boxes"> <div class="container"> <div class="box"> <img src="9.jpg" alt=""> <h3>html5 markup</h3> <p>this is some random text:</p> </div> <div class="box"> <img src="9.jpg" alt=""> <h3>css 3</h3> <p>what am i really tring to do here? &gt;&lt;:</p> </div> <div class="box"> <img src="9.jpg" alt=""> <h3>graphic design</h3> <p>I'm not so great with this html stuff</p> </div> </div> </section></body></html>
  6. I think in Wordpress, you have to select "publish" before it becomes active/
  7. IDK what options you have available, but you might try the following: background:inherit; /* use the parent's background definition */ or you could try: background-color: rgba(0,0,0,0); /* transparent */ p.s. it might not be a background issue. Maybe you have a margin or border. You could try border:none; margin:0;
  8. That's very nice. I would like to do that on my site too where at the moment I just have a script to generate a drop down of all the h2 headers of the current page, but without any highlighting.
  9. I think what you need is style="text-align:justify" but I don't know my way round teh Wordpress engine so I can't say where to put it.
  10. the tag you need is <abbr title="test to appear on hover">thing to hover over</abbr>
  11. I was as yet unaware of vars and the calc function (there is a lot to learn with this css malarkey and I really appreciate the help I have received on these forums). I found calc() and var() vastly more flexible than the php I had been using to generate my css. Just for the record: I've implemented my color schemes with css vars now and also the menus are working great... some of it still needs tweaking but prototype demo is here: http://ngaro.online
  12. After reading various tutorials I implemented drop down menus for my site and all appeared OK(ish) until I looked at it on my cell phone. Now I'm trying to figure out a neat way to get round the layout problem and hope someone can suggest a neat way to solve it... menu 3 shows a drop down menu using hover attribute (forgive the colors, it's garish to help me see what is what). alas menu 2 is too wide because I had set white-space:nowrap for the menu options and so it gets truncated on the narrow screen. taking off the nowrap, it's wrapping on every word and I don't really want to force it to be be width 100% because then menus with only short entries look terrible. I tried max-width, but that didn't help. I am confident someone somewhere will have solved exactly this problem and I'm hoping to do it in without resorting to javascript. Thanks in advance for suggestions.
  13. Actually struggling with another problem and it's possible I can solve it using this as a feature but at the moment it's giving the wrong priority to spacing vs word wrap. I'll ask it in another if that's OK as this one is currently doing what I want.
  14. Thank you ever so much! I used vertical-align:text-top; on my container class and now it works with videos as well! Once you explained I did indeed say "Doh!": That space was there for potential character descenders (am I right)? I kept the font size and line height normal as I overlay captions on my images and if anyone wants to see the web theme engine I'm developing, it gets tested online here: http://ngaro.online/
  15. Actually you can use server side includes in straight HTML, but you have to enable it. I've never used it myself as I just use PhP, but I saw a tutorial for it here: https://www.yourhtmlsource.com/sitemanagement/includes.html
  16. It's the http root which is not the same as your file system root. This is because you don't want to put your entire file system online. It is configurable on your file server. And the first part of the URL is handled by a DNS lookup, so that vistor to your site are directed to your computer at whatever IP address it has been registered. So say you are using Apache on a server running Linux then there will be a file called /etc/httpd/conf/httpd.conf In that (text) file will be a line saying something like: DocumentRoot "/srv/http" The actual file that visitors access thus will be /srv/http/images/picture.jpg but your web pages can reference them as /images/picture.jpg
  17. Click the share link in Youtube and choose <> (embed) You get this code: <iframe width="560" height="315" src="https://www.youtube.com/embed/7-OAyM_LNLc" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> They evidently don't use the video tag but instead host their own player in an iframe. By sheer coincidence I've been playing with embedding portrait orientation videos from both Youtube and Bitchute and managed to make them scale with the page. You can try it here and use "view source" to see the code my php generated. http://ngaro.online/angelica.php/home2 (youtube) http://ngaro.online/angelica.php/home3 (bitchute)
  18. I am getting inexplicable bottom margin under all my images. Developer Tools didn't associate it with anything and I spent ages looking for a logical explanation, but to no avail. No doubt once I find out, I will slap my head and say DOH! Simpson style, but at the moment I'm baffled. By pure coincidence I made a typo and suddenly it disappeared. The mystery margin is associated with having a <!DOCTYPE html> statement and now I'm forced to leave that out to make my site work. I'm hoping someone can shed light on this. Here is a screen shot, one with and one without the DOCTYPE: notice the golden bar under the image in the first one. I whittled the page right down to just a few lines and you can see it here: http://ngaro.online/mp.html - the mystery padding due to DOCTYPE http://ngaro.online/mpok.html - the mystery padding vanishes without DOCTYPE IDK if it's worth me posting the trivial code as you can just click on "view source" to see it. Thanks in advance for any suggestions 🙂
×
×
  • Create New...