How do you get margins working in all browsers?

bigfoot12

New member
Oct 7, 2013
35
0
0
I am trying to get my content to connect to the navigation bar/column:

Live Off The Land

I am also trying to make my Categories bar work in all browsers. Unfortunately, I haven't seen anything happen yet.


Everything looks good in Internet Explorer, but Mozilla Firefox and Google Chrome are not working well.

For my content class, I did margin-left: 315px;

and I also typed -webkit-margin-left: 315px; and -moz-margin-left: 315px;


and uploaded it to the server. Still didn't work
 


Ummm, no offense, but I think margins are the least of your worries.

Thanks for giving me a smile though. :)
 
attachment.php
 
Jesus christ mate... There is a reason when starting out it's recommended to use frameworks, like bootstrap, or find a template, then modify it. Just because you know css and html doesn't mean you have the ability to design, maybe modify, but design is a whole other thing. It's like a mechanic versus a car designer, one designs cars, one fixes them.

Save your self time, and spend the $5 to $20 to buy a pre-made template/framework, and use that as the basic foundation for your site:

50+ Bootstrap Skins | CodeCanyon

decent one: Skins - R-flex Designer Toolkit | CodeCanyon

another decent one: Skins - MoonLight Bootstrap Skin | CodeCanyon

You are trying to start from scratch without having the skills to understand the make up of a proper site structure, in regards to the css and html. I did that back in the late 90s, but that was before there was Google, and these fancy standalone framework to work off of.

Good luck bro.
 
Lol, the website is a gem - it reminds me of designs during the times of Netscape :D
 
No I am only programming in this, because I realized that the designs in free templates are limited in what you can do. Can't do much HTML coding with free online website creators.

As far as I know, you'll have a hard time with dividers and CSS bullet style if you're using a free service like Webs or Moonfruit.

My designs were actually worse when I was using their templates.

Ah it was just fill in the blank.
 
Here's what I do know:

-At top of page is logo, search bar,
- side is sidebars- for navigational menu
-middle is content
-after articles are comments section
-Bottom of page is footer, site map, privacy, terms and conditions
- 3 to 4 colors max
- people put ads in content or on the sides
- newsletter sign up form on the side
- do not leave too much empty space
- share buttons on side or on top
 
Take a look at just about any website... Now look at yours... Now look back at any other website... Take another peak at yours... Notice any differences?

Either you're doing something wrong, or damn near every other website is doing something wrong.
 
For starters, most computer screens support more than 16 colors nowadays. Be adventurous, and break out of that 16 color mold!
 
Save yourself a whole load of trouble. Install wordpress (your host proabbly has a one click installer), buy a decent theme for like $20 and concentrate on developing the sites content rather than that awful design. You will thank me for starting the site in wordpress once you realise that as soon as you start building up a decent number of articles and categories, your 'static' thml files are going to be a nightmare to manage.
 
For your references

<!DOCTYPE html>
<html lang="en-US">
<head>
<style>
.city {
float: left;
margin: 5px;
padding: 15px;
width: 300px;
height: 300px;
border: 1px solid black;
}
</style>
</head>
<body>

<h1>W3Schools Demo</h1>
<h2>Resize this responsive page!</h2>

<div class="city">
<h2>London</h2>
<p>London is the capital city of England.</p>
<p>It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>

<div class="city">
<h2>Paris</h2>
<p>Paris is the capital and most populous city of France.</p>
</div>

<div class="city">
<h2>Tokyo</h2>
<p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.</p>
</div>

</body>
</html>