Member Avatar for leegeorg07

hi, i have been working on a log with my friend and we want it to look like the attachment, i currently have a basic css part and html:

#index_blog{
	float:left;
}

and html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>Welcome to CTech</title>
		<link type="text/css"
		rel="stylesheet"
		src="CTech.css"/>
	</head>
	<body>
		<div id="index_blog">
			This is some text
		</div>
		<div id="twtr-profile-widget"></div>
		<script src="http://widgets.twimg.com/j/1/widget.js"></script>
		<link href="http://widgets.twimg.com/j/1/widget.css" type="text/css" rel="stylesheet">
		<script >
			new TWTR.Widget({
  				profile: true,
  				id: 'twtr-profile-widget',
  				loop: true,
  				width: 250,
 	 			height: 300,
  				theme: {
    				shell: {
      				background: '#000000',
      				color: '#00fcfc'
    				},
   	 			tweets: {
    				background: '#7f7bfa',
      				color: '#00fcfc',
      				links: '#fff200'
    				}
  				}
			}).render().setProfile('CadetTech').start();
		</script>
	</body>
</html>

what can i do to have it like the attachment?

mock_up.bmp (576.05 KB)
  • 2 Contributors
  • 4 Replies
  • 109 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by leegeorg07
Member Avatar for AdrianaTX

might help if you ask something specific first

Member Avatar for leegeorg07

well, currently with that code, the it all aligns vertically, as in:
text
----------
twitter
---------
text

what can i do about it?

Member Avatar for AdrianaTX

use a DIV for each section "myBlogPosts", "twitterFeed", "yourBlogPosts", and float each DIV left.

#yourBlogPosts {
      float: left;

}
Member Avatar for leegeorg07

thanks, i tried that and it seemed to work.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.