Starting to learn 'Web development'

[AIX-Who]

Hello, i've started on learning some web dev languages.

So for my first little project i have retrieved data from a mysql database and show it in a table like this:

[T]http://puu.sh/d1A1O/2fb847773d.png[/T]

Next i would like to know how i can change the how the table looks and center it

[B]WEBSITE LIVE:
[/B]

[url]http://fragtechgaming.info/[/url]

Some parts are still uploading :<

[Spero78]

[url]http://www.codecademy.com/courses/web-beginner-en-TlhFi/0/1?curriculum_id=50579fb998b470000202dc8b[/url]

[Crayz]

Don't rely too much on tables, some people tend to go overboard and design entire pages of their website using them. div, list, etc keep your code cleaner, flexible, and easier to format with css.

To re-create your table with divs you could do something like this:

<style type="text/css">
	div.row { 
		width: 300px;
		height: 20px;
	}
		div.rowL { 
			float: left;
			width: 80%;
		}
		div.rowR { 
			float: left;
			width: 20%;
		}
</style>

<!-- some php here -->
// for(loop)
	<div class="row">
		<div class="rowL">
			<? echo $steamid ?>
		</div>
		<div class="rowR">
			<? echo $cash ?>
		</div>
	</div>
// end loop

To clean up your code even more keep your css and php/html separate using something like this in your page's head:

<link rel="stylesheet" type="text/css" href="style.css">

[AIX-Who]

Thanks for the later reply, still appreciate you helping :P

Working with my brother we managed to make a simple website like this:

[t]http://i.imgur.com/eEM5XDy.png[/t]

We will make the other pages with php i believe, apart from the forums.

I got the layout idea from flatui loading screen, but instead we used flexsheets to make adding elements easier.

[wauterboi]

I think you might want to look into some better icons. I personally like the Android Flat icons.

[url]https://developer.android.com/design/downloads/index.html[/url]

[AIX-Who]

Yeah, i just used the ones in photoshop , have no drawing skills whatsoever. Thanks!

[Maqtiah]

You can just add text align-center on the <td> elements if that's what you mean.
However centering everything looks really bad if you ask me.

And to @Crayz, tables are fine for tabular data which is what he needs.

Demo: [URL]http://jsfiddle.net/taxjz9cx/[/URL]

Centered: [URL="http://jsfiddle.net/taxjz9cx/1/"]http://jsfiddle.net/taxjz9cx/2/[/URL]

[AIX-Who]

Made some progress;

[IMG]https://i.imgur.com/KBMKdcd.png[/IMG]

New logo has been made aswell:

[IMG]http://i.imgur.com/cNvilJ4.png[/IMG]

*Grenade from [url]www.flaticon.com*[/url]

[knoxed]

You're doing well. Keep up the good work.

[radina]

Forget about tables. Crazyz is right. Keep your code clean

[benbb]

Once you've learned HTML/CSS to a decent level, I highly recommend using a front-end framework like Boostrap. Saves you a lot of time.

Just make sure to kit it out to make it not look like default-Bootstrap (it's widely used and stands out like a sore thumb to any web-developer/designer).

[URL]http://getbootstrap.com/[/URL]

There's also similar front-end frameworks/boilerplates like
Skeleton: [URL]http://getskeleton.com/[/URL]
and
Zurb Foundation: [URL]http://foundation.zurb.com/[/URL]

[TrinityX]

However, if you want to build a website from scratch and not use a framework, i really reccomend using [URL="http://necolas.github.io/normalize.css/"]Normalize.css[/URL], as it will reduce the amount of browser quirks, and make styling elements with CSS easier.

[xxxdeath]

Dont forget about flex boxes

[KmartSqrl]

Everyone telling him to not use tables when he's displaying tabular data is a dumb dumb and needs to read up on semantics and the reasons WHY you avoid tables for LAYOUT. Tables are not 100% evil. He's using them for exactly what they're intended to be used for..

[AIX-Who]

[QUOTE=xxxdeath;46819576]Dont forget about flex boxes[/QUOTE]

I use flexboxes now, didn't before but i had to due to adding new buttons etc being a pain in the ass.

[xxxdeath]

[QUOTE=AIX-Who;46857050]I use flexboxes now, didn't before but i had to due to adding new buttons etc being a pain in the ass.[/QUOTE]

They said Flex boxes are dumb, but they don't truly understand the power behind them.....

[buhbang]

[QUOTE=xxxdeath;46860374]They said Flex boxes are dumb, but they don't truly understand the power behind them.....[/QUOTE]

no you're dumb. not the flex boxes

[QUOTE=KmartSqrl;46825514]Everyone telling him to not use tables when he's displaying tabular data is a dumb dumb and needs to read up on semantics and the reasons WHY you avoid tables for LAYOUT. Tables are not 100% evil. He's using them for exactly what they're intended to be used for..[/QUOTE]

[xxxdeath]

Hey guy, you don't know meeeeee.