Really struggling with the can't find a definitive answer on this. Trying to help my local community by promoting a list of business that are still operating during the covid-19 outbreak.
My problem is that the table width in mobile view looks awful and basically chops off the last column. Please can you advise any css I could use to correct this?
See https://www.larklaneguide.com/delivery-and-takeaway-on-lark-lane-during-covid-19/
TIA
Clare
Related
quite possibly this is a duplicate for another question, if it is please close this question,
I am wondering how is it possible to have different layout for desktop view and different for mobile, please check the pictures and sorry for the bad design i used msPaint
Thanks!
desktop view
mobile view
you must use media query. It's better to share your source code but you can use this link for more information: https://www.w3schools.com/css/css_rwd_mediaqueries.asp
Incredibly new to CSS, I have done some very basic stuff over the years but I am trying to find a solution to a design I would like to create for my Drupal product page. I have tried searching but it's like since I am self-taught I have no idea what terms I should be searching for.
Here is the layout I am looking to design (attached).
So I want basically a 2 column layout with a 3 column header that is located in the main section. Should/Can I do this with grids? I am not too terrible sure what I should be searching for to understand how to make this happen. My only concern with a grid is that I can't have the sidebar contained to a single row height. Can someone point me in the right direction?
Thanks so much!
Since you are looking for a grid-based system, I would highly recommend taking a look at Bootstrap for implementing your desired layout. Take a look at the link and it will explain how exactly to achieve your layout specified above.
I need some advices on how to create a website in a way that it will keep its size on every resolution.
I've tried in many ways but I never made it work, and it's hard to understand responsive web design because I can't find it in my language. I just want some brief advices, and simple explanations about how to keep resolutions of content divs on different resolutions in CSS/HTML
Here's what I've tried until now but it didn't work:
There are just the codes without images, its just a way to see what I did wrong and what I should do.
Check this piece of code and play with it to get a basic idea: http://jsfiddle.net/Hx5Xn/1/
Furthermore I would advise you to check some online tutorials.
Check
http://www.w3schools.com/
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries
http://blog.teamtreehouse.com/beginners-guide-to-responsive-web-design
Hi for the last month I have started to learn CSS.Fist thing I did is read everything i could find on www.w3school.com , after that I started reading CSS Mastery 2nd edition.I have build a couple of my own websites with succes but I'm still not happy with what I know , I even practiced with the new CSS3 elements.
I've seen alot of cool stuff build using css especialy on http://www.cssplay.co.uk/ but the only problem is the source code is not displayed and I don't know how the bloody things are.A good example is this:
http://www.cssplay.co.uk/menu/tilt.html
And these is only one of the things that I've seen on this website and would like o learn how to build them.
So anyone know any other similar sites that ofer a good explanation on the more advanced stuff about css(not beginer stuff like building some drop down menus , rollover or hover efects )?Any advice is much apreciated thank you!
As already mentioned, tools like Firebug/Chrome Inspector are definite must haves.
I gained the most experience from real world problems with various different browsers. You make a site, it doesn't look so good in a particular browser. So you search on the internet. Find a solution and memorize it. I think that CSS in itself is a fairly simple tool, I class 'advanced' CSS as mastering the various techniques required to make sites work cross browser and in browsers like IE6/IE7+.
Also, Never give up with CSS, if you find a problem try and find an answer. Most of the time, there will be a simple solution.
In general, make sure your CSS is as simple as can be. I generally find that most complicated CSS can be replaced with relatively simple code, and find people get carried away and forget simple techniques to achieve similar solutions. One such problem, would be putting a button on the right hand side of a div, like below:
-----------------------------------------------
| Button |
-----------------------------------------------
You may see that some people will float the button right, adding more complexity than necessary. What ever happened to text-align:right? :-)
Finally, make sure you find a couple of blogs you like, for example http://csstricks.com and read them, taking note of new techniques. Try and master a '2 column layout', understand the difference between block/inline-block/inline, margin collapsing, tables, html forms, IE6/7 hasLayout, the list goes on. Most of which you will cover if you try and make a website template from scratch. Maybe start with an existing site and see if you can achieve the same layout.
I'm not sure with CSS how to learn it's pitfalls without encountering them mistakenly.
It looks like the stylesheet for the maze is located at: http://www.cssplay.co.uk/menu/candr/tilt.css. You can use that against the source code to figure it out.
One of my favorite is A List Apart. Great articles, not only about CSS like I linked, but about web design and more.
Also HTML Dog has some nice CSS entries.
Then, you can find great CSS resources on the w3 site.
First of all I am not programmer nor web developer.
Someone made a website for me but can not contact him right now.
After 3 days of googling i decided to post this question.
How to enable gorizontal scrolling instead of menu and footer wrap on window resize?
I tried attributes such as: display:inline-block; white-space: nowrap (i think this is related to text only), some JavaScripts.
I might placed these elements in wrong place as it's hard to know that code.
This is index file:
http://slawgd.webpark.pl/index.rtf
and pls find CSS here:
http://slawgd.webpark.pl/style.css
Thank you very much for you help!!
Greg
CAUTION: I am sorry that my answer has no real solution so you can choose to ignore.
The followings are just my comment on your web page after I had analyzed it.
It would be slightly better if you copy the rendered code of HTML as we won't get your data in your SQL Database.
Simply right click the page in browser and find Source Code to get it.
Also, you might find a better answer from the someone who help you to produce it because he is the only one person familiarize your page most.
EDIT: Just a suggestion and not a solution.
After I looked at your page, it is suggested that to find the someone because the page was complicated designed.
It needs lots of effort to modify it without affecting other component.
Moreover, it is quite horrible to work out on cross-broswer compatibility because the code is not well designed.
In mainland China, users of Firefox might not have much, but there are still numbers of users using Maxthon which include WebKit engine.
Variant IE-based browser in mainland China also give a slightly different result of rendering so the code must be optimized.
Therefore, ask the website editor for cleaning the code (such as repeating CSS, malformed HTML structure, etc) and working hard on cross-broswer compatibility is considerable.
More personal comment:
In conclusion, if you find a worker for your website construction with money pay, it seems that it is a huge job to rewrite it and it is not easy to persuade him to help you.
Maybe you can ask someone to help you with a simpler basic structure and insert the original JS background slide effect and drop menu effect to your newer, simpler, and cleaner structure.
There are still a readable amount of unnecessary wrappers inside the page.