Web Development Questions That Don't Need Their Own Thread v2
3,079 replies, posted
[QUOTE=Funcoot;32068412]How many people here use a grid system. Are there downfalls to using grids?[/QUOTE]
It's not semantic, it's the reason 978.gs doesn't offer css templates.
[QUOTE=Jelly;32069640]It's not semantic, it's the reason 978.gs doesn't offer css templates.[/QUOTE]
Semantic as in?
Using CSS, how would I get an entire page to align to the center of the website instead of on the left side?
Set a width then use margin:0 auto;
[QUOTE=slayer20;32070254]Using CSS, how would I get an entire page to align to the center of the website instead of on the left side?[/QUOTE]
Wrap what you want centered in a container and in the css file, for the container class use,
margin: 0 auto;
But would that center on everyone's page?
I want everything in the <body> to be centered according to the person's web browser.
[QUOTE=Funcoot;32070189]Semantic as in?[/QUOTE]
You can read the code and know which element is which.
[quote]
[b]Where can I download the CSS for your grid systems?[/b]
To be honest, we are not huge fans of CSS frameworks. HTML, when written correctly, should semantically describe your content (as much that is realistically feasible). Mucking up your markup with <div class="grid_5"> and <div class="grid_6 pull_6"> is not considered best practice. With that being said, CSS frameworks can make rapid prototyping a breeze. They can let someone of any skill-set quickly mock up a basic look and feel of a website. In some ways, it may even be faster than doing it in Photoshop.
We'll likely add a CSS framework for prototyping sometime in the future. For now, there are plenty of existing CSS frameworks out there that should be easily adapted to work with the grid systems on this site.
[/quote]
Source: [url]http://978.gs/faq/[/url]
I know lots about HTML and CSS and minimal amounts of PHP, so could anyone point me in the right direction of how to go about doing this;
[url]http://img803.imageshack.us/img803/9516/lotsmorework.jpg[/url]
The bit at the bottom, you tick the box of which product you want, enter your details then click pay and it would re-direct to paypal
Would gimp be useful for making a website layout? I don't have the money for Photoshop.
[editline]2nd September 2011[/editline]
[QUOTE=Adzter;32072820]I know lots about HTML and CSS and minimal amounts of PHP, so could anyone point me in the right direction of how to go about doing this;
[url]http://img803.imageshack.us/img803/9516/lotsmorework.jpg[/url]
The bit at the bottom, you tick the box of which product you want, enter your details then click pay and it would re-direct to paypal[/QUOTE]
Oh sweet jesus the Comic Sans.
[QUOTE=Rocko's;32075825]Would gimp be useful for making a website layout? I don't have the money for Photoshop.
[editline]2nd September 2011[/editline]
Oh sweet jesus the Comic Sans.[/QUOTE]I use gimp for my buttons and gradients, it works well for me, even though I generally suck with image editing.
[QUOTE=slayer20;32070465]But would that center on everyone's page?
I want everything in the <body> to be centered according to the person's web browser.[/QUOTE]
body {margin:0 auto;} would position all elements nested in the body tag in the center of the page.
Ok so I got my webpage centered in Internet Explorer, but in Firefox it's not centered.
Internet Explorer:
[thumb] http://filesmelt.com/dl/mainpage11.jpg[/thumb]
Firefox:
[thumb] http://filesmelt.com/dl/mainpage21.jpg[/thumb]
Main page code
[code]
<html>
<head>
<link href="c.css" rel="stylesheet" type="text/css" />
<head>
<body>
<div id="outer">
<img src="logo.jpg" height="175px" />
<div id="links">
<a href="test">Resume</a>
•
<a href="test">Personal Info</a>
•
<a href="test">Cover Letter</a>
•
<a href="test">Fun</a>
</div>
<div id="bigp">
<p>
<img src="fiona_r.png" height="300" id="fiona" />
"Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
<p>
<img src="redbeast.png" width="275" id="redbeast" />
"Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
<p>
"Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
</div>
<address>
This is where a neat little address goes
</address>
</div>
</body>
</html>
[/code]
css
[code]
body
{
background: url(background.jpg);
}
h2
{
width: 540px;
text-align: center;
}
a
{
font-size: 24px;
padding: 10px;
text-decoration: none;
color: white;
}
p
{
font-family: monospace;
}
address
{
color: white;
}
#links
{
margin: 0px 0px 10px 0px;
width: 560px;
height: 50px;
padding: 5px;
background-color: slategray;
border-width: 3px 2px 2px 3px;
border-color: darkgray;
border-style: solid;
}
#outer
{
text-align: center;
}
#bigp
{
margin: 0px;
width: 700px;
height: 600px;
background-color: slategray;
border-width: 3px 2px 2px 3px;
border-color: darkgray;
border-style: solid;
text-align: left;
padding: 10px;
line-height: 25px;
}
#fiona
{
float: right;
margin: 0px 0px 5px 20px;
border-color: darkgray;
border-style: solid;
border-width: 0px 0px 2px 0px;
display: block;
}
#redbeast
{
float: left;
margin: 0px 20px 5px 0px;
border-color: darkgray;
border-style: solid;
border-width: 2px;
display: block;
}
[/code]
change #outer { text-align:center; } to #outer {margin: 0 auto:}, it has already been said so many times in previous posts though...
Seriously don't try to find another way to do it, the margin auto trick really is the best way, far better than trying to work out the god damn percentages, percentages which IE has never really been fond of.
[QUOTE=slayer20;32076170]stuff
[/QUOTE]
Use margin:auto; on #outer.
[QUOTE=Rocko's;32075825]Would gimp be useful for making a website layout? I don't have the money for Photoshop.
[editline]2nd September 2011[/editline]
Oh sweet jesus the Comic Sans.[/QUOTE]
Yeah my mate made the picture and knew I hated comic sans, so does anyone have any idea how I would go about doing it?
#outer
{
margin: auto;
}
Just like that?
[editline]2nd September 2011[/editline]
I did that, and now everything is pushed to the left in both IE and Firefox.
[QUOTE=slayer20;32076316]#outer
{
margin: auto;
}
Just like that?
[editline]2nd September 2011[/editline]
I did that, and now everything is pushed to the left in both IE and Firefox.[/QUOTE]
probably due to the floats your using on your content.
[QUOTE=Sharpshooter;32076402]probably due to the floats your using on your content.[/QUOTE]
It was because of my other margins. I changed the settings on them and now it's all aligned. Thank you!
Let's say I want to make a simple & small clone of a Pokémon-game where you can just walk around and battle monsters. The game has to run in a normal browser-window and has to be smooth. It should also allow for multiplayer-support in the future. What language or platform would be suitable for this? Flash? Java? JavaScript?
EDIT: I know that it's doable in any of the platforms, but let's say I don't have experience with any of them and I want to get to the project as soon as possible (and not spends months learning the platform/language first).
[QUOTE=theJohn;32077698]Let's say I want to make a simple & small clone of a Pokémon-game where you can just walk around and battle monsters. The game has to run in a normal browser-window and has to be smooth. It should also allow for multiplayer-support in the future. What language or platform would be suitable for this? Flash? Java? JavaScript?
EDIT: I know that it's doable in any of the platforms, but let's say I don't have experience with any of them and I want to get to the project as soon as possible [b](and not spends months learning the platform/language first).[/b][/QUOTE]
You'll have to for something that complex
[QUOTE=theJohn;32077698]Let's say I want to make a simple & small clone of a Pokémon-game where you can just walk around and battle monsters. The game has to run in a normal browser-window and has to be smooth. It should also allow for multiplayer-support in the future. What language or platform would be suitable for this? Flash? Java? JavaScript?
EDIT: I know that it's doable in any of the platforms, but let's say I don't have experience with any of them and I want to get to the project as soon as possible (and not spends months learning the platform/language first).[/QUOTE]
Like you said, it's pretty much doable in any platform - I'd use js on the front and node.js on the back.
socket.io
[QUOTE=Rocko's;32075825]Would gimp be useful for making a website layout? I don't have the money for Photoshop.
[editline]2nd September 2011[/editline]
Oh sweet jesus the Comic Sans.[/QUOTE]
Anything would be good for creating a website layout, if it's simple you can just do it on paper or yeah gimp is decent
[QUOTE=StinkyJoe;32036010]APC really isn't a good idea for this - not saying the problem isn't elsewhere[B][1][/B], but at best APC should be in front of a more reliable storage method, with no expectation on your end that the data will actually be there. Redis or some fast document-based database software is probably a better fit (mongodb, maybe?)
[B][1][/B] - APC doesn't work in FCGI environments; Check that you have enough memory allocated to prevent it from flushing the storage as often; Check that entries are being written correctly and not overwriting each-other; Embrace the fact that APC is [b]not[/b] persistent.
This SO thread might hold some helpful pointers:
[url]http://stackoverflow.com/questions/4468805/apc-values-randomly-disappear[/url]
Good luck![/QUOTE]
Legendary response, thank you very much!
I chose APC because battles only last ~1 minute, and (stupidly) assumed it would work (I was aware the data wouldn't be at all persistant, but for a minute!). Nor did I know about FCGI, so I'll be looking at an alternative for sure, looking at mongo now.
[editline]2nd September 2011[/editline]
[url]http://www.brandonturner.net/blog/2009/07/fastcgi_with_php_opcode_cache/[/url] <--- interesting
Even if I do that I'll work on a fall-back for sure, the reason APC is good is because I can setup PvP battles using it and share the data (hence why I chose APC > session data).
Hey guys, got any tips on how to improve my website at [URL]http://www.tomitoikka.com[/URL] ?
Hey guys, I'm having the weirdest problem and I'm not sure what's going on. Basicly in Opera the sun shows, but in other browsers(ff, ie, ch, sf) it doesn't show up,
pic:
[IMG]http://giantice.com/upgi/uploads/dafyxc_03092011045631.PNG[/IMG]
code: in css
.sunbar{
width:1200px;
background-image:url(sun.png);
background-repeat:no-repeat;
height:250px;
margin:0 auto;
}
in html
<div class="sunbar"></div>
iirc, several browsers won't let you have an empty fixed-size div without a position attribute.
[QUOTE=Namelezz!;32088858]Hey guys, got any tips on how to improve my website at [URL]http://www.tomitoikka.com[/URL] ?[/QUOTE]
not the biggest fan of photoshop fx presets, makes it bad contrast instead of using something like a dark shadow
Why does this happen when I try and fit four 250px elements into a 1000px container?
[img]http://gyazo.com/725e4bd4ca726b49657212614c376c2e.png[/img]
Here's the 1000px container CSS:
[code]#bottomColumns
{
width: 1000px;
border: 1px solid green;
height: 300px;
}[/code]
And here's the CSS for the boxes.
[code]
#bottomColumn
{
float: left;
position: relative;
width: 250px;
height: 240px;
border: 1px solid red;
}
[/code]
I'm sure this must be a pretty basic mistake or misunderstanding of how CSS works in this instance so I'm just hoping someone can point out what's going wrong.
[QUOTE=AMD 32;32092922]Why does this happen when I try and fit four 250px elements into a 1000px container?
[img]http://gyazo.com/725e4bd4ca726b49657212614c376c2e.png[/img]
Here's the 1000px container CSS:
[code]#bottomColumns
{
width: 1000px;
border: 1px solid green;
height: 300px;
}[/code]
And here's the CSS for the boxes.
[code]
#bottomColumn
{
float: left;
position: relative;
width: 250px;
height: 240px;
border: 1px solid red;
}
[/code]
I'm sure this must be a pretty basic mistake or misunderstanding of how CSS works in this instance so I'm just hoping someone can point out what's going wrong.[/QUOTE]
the borders add 2px to the width of each box
Sorry, you need to Log In to post a reply to this thread.
