- This topic is empty.
December 26, 2014 at 1:56 pm #191659tarnos12Participant
Hey, I am trying to achieve something similar to my current html code:
I have read alot about bootstrap/css but there are so many options I am confused, I want to achieve similar result which you can see on the link, but I want it to work on all or at least most resolutions.
Currently all tables and fonts stay on the same size, on lower resolutions they collide with each other.
If question is too vague then dont give me a straight answer but help me out with some resources I can read or tell me If I should use tables in my case or if there is a better way to do it.
I tried using div class row etc but I couldnt move a button or anything at all.
I hope you can help me out, or point me to a specific tutorial. ThanksDecember 26, 2014 at 4:06 pm #191663GSutherlandParticipant
You’re using position: absolute to achieve your current layout, and this is generally frowned upon. It will also make it nigh impossible to achieve any sort of adaptive or responsive layout. Most grid and layout systems work with floating items left and right, which I see your tables are. But there’s not much purpose to floating them when you then position them absolutely.
This is a good primer on basic layout approaches:
In the case of your project, I do think using tables to display the information makes sense, but you can enclose them within divs in order to control the flow of the layout.
It’s definitely true that there’s a lot of information out there, but if you’re going to use Bootstrap they do have pretty good documentation. Here’s their docs on tables:
If you combine that with their grid scaffolding system you should be able to pretty quickly put together a more adaptive version of what you have.
Keep in mind that Bootstrap will impose a certain aesthetic onto your application if you go that route.December 26, 2014 at 8:53 pm #191672tarnos12Participant
Hey, thanks for all the links. I will do my best to change the look of my website, in the meantime I updated the game if you’d like to check it out. There is also a reddit thread:
Thanks again :)
- The forum ‘CSS’ is closed to new topics and replies.