3 Replies - 544 Views - Last Post: 19 January 2012 - 01:50 AM

#1 theshowtekfan  Icon User is offline

  • D.I.C Head

Reputation: 1
  • View blog
  • Posts: 147
  • Joined: 27-September 11

positioning and styling in css/html

Posted 21 December 2011 - 03:23 PM

hey there i am a php programmer and i know css but i am really strugling alot with styling my pages :/

here are some of the problems im facing

*lining stuff up on the same rows
*collecting data using php then display them in rows inside a table, while its looking nice/customisable
*and yea basicly positioning


could anyone explain a litlle about displaying information that i gather using php in rows inside a table ?

and how could i go with positioning stuff on the same row like a menu and a image next to each other :P

hoping for VERY HQ answers, if i tech this then i can make VERY Hq webpages :)

Is This A Good Question/Topic? 0
  • +

Replies To: positioning and styling in css/html

#2 codeprada  Icon User is offline

  • Changed Man With Different Priorities
  • member icon

Reputation: 943
  • View blog
  • Posts: 2,353
  • Joined: 15-February 11

Re: positioning and styling in css/html

Posted 21 December 2011 - 07:21 PM

Basically to line elements up on the same row you'll have to set their display property to inline.

Example
<div class="horizontal"><button>Hello</button></div>
<div class="horizontal"><button>World</button></div>


DIV elements are naturally displayed below each other. To place them on the same row
<style>
	.horizontal {
		display: inline;
	}
</style>



To place data directly from PHP within a table you can simply echo the data or use a cleaner way, a template engine.
Demonstrating the first method...
<?php
	$data = array(
		array('codeprada', 'Male', 20),
		array('theshowtekfan', 'NaN', 999)
	);
?>
<table>
	<thead>
		<tr>
			<th>Name</th>
			<th>Gender</th>
			<th>Age</th>
		</tr>
	</thead>
	<tbody>
	<?php
		foreach($data as $entry)
		{
			echo "<tr><td>{$entry[0]}</td><td>{$entry[1]}</td><td>{$entry[2]}</td></tr>"
		}
	?>
	</tbody>
</table>


This method can get confusing and cumbersome rather quickly that's why I'd suggest using a template engine to achieve this while keeping your PHP separate from HTML. Check out: An Introduction To Smarty Template Engine

Positioning elements depends on where you want to position them. Usually it comes down to the attributes:
  • float
  • display
  • position
  • top
  • left
So look into those.
Was This Post Helpful? 0
  • +
  • -

#3 FrankC  Icon User is offline

  • New D.I.C Head

Reputation: 3
  • View blog
  • Posts: 45
  • Joined: 06-October 11

Re: positioning and styling in css/html

Posted 22 December 2011 - 03:28 PM

theshowtekfan said:

*lining stuff up on the same rows
(...)
*and yea basicly positioning


Hi there,

See the first two tutorials on my signature page.
Was This Post Helpful? 0
  • +
  • -

#4 Mister_grey2010  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 1
  • Joined: 18-January 12

Re: positioning and styling in css/html

Posted 19 January 2012 - 01:50 AM

About positioning take a look here
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1