×
INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Contact US

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Students Click Here

CSS Anyone?

CSS Anyone?

CSS Anyone?

(OP)
Hello! I am a graphic designer and I normally try to stay on the designing end of websites, but I am trying to start learning CSS since  you still need it even with InDesign. I have created a layered page with apdivs. For some reason it all of the sudden went to flush left in the browser and I have tried and tried and can't figure out what I need to do to get it centered again, would you mind taking a look at it and giving me some guidance on what I need to do to get it centered? I would GREATLY appreciate it!!! http://www.dgstanleygraphics.com/hallmarkauto_html/index.html

RE: CSS Anyone?


...you'll have to redo the structure of your div layouts really...

...i would do it but it would mean time to fix the layout, currently i charge for work like this at approx $90.00 per page, assuming no fancy stuff like jquery is being used...


 

andrew

============
  www.apepp.info
============

RE: CSS Anyone?

(OP)
Thank you so much! I totally understand about the time and cost. I am just learning coding and am still at the baby step stage. My brain is spinning! I found a work around and everything is centered, but I can't get my background image centered. Would you please show me how to do that? Thanks so much for being so nice and helpful, you are a life saver!

The page with everything centered except the background (It dropped my border when I changed the css file):
http://www.dgstanleygraphics.com/hal...exsctbrdr.html

My css file with the border but not centered:
@charset "UTF-8";
body {
padding: 0;
color: #000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
line-height: 1.4;
background-color: #004CA9;
background-image: url(images/bkgls.png);
background-repeat: no-repeat;
text-align: center;
display: block;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
.logo {
display: block;
width: 648px;
margin-right: auto;
margin-left: auto;
}
header {
color: #FFF;
}
#apDiv3 div h1 .h1 {
font-family: Arial, Helvetica, sans-serif;
color: #FFF;
text-align: center;
display: block;
width: 942px;
margin-right: auto;
margin-left: auto;
}
.sign {
background-image: url(images/sign.png);
background-repeat: no-repeat;
text-align: center;
display: block;
width: 864px;
margin-right: auto;
margin-left: auto;
}
#apDiv6 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
}
.locations {
font-family: Arial, Helvetica, sans-serif;
text-align: center;
display: block;
width: 170px;
margin-right: auto;
margin-left: auto;
font-size: 20px;
}
#apDiv9 .heading2 {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv9 .heading2 {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv7 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv8 .locations {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
}
p {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.heading2 strong {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
}
#apDiv7 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv7 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
}


My .css centered but no background:

@charset "UTF-8";
body {
padding: 0;
color: #000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
line-height: 1.4;
background-color: #004CA9;
background-image: url(file:///Macintosh%20HD/Work/Terry%20Cornelius/hallmarkauto_html/images/bkgls.png);
background-repeat: no-repeat;
text-align: center;
display: block;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
.logo {
display: block;
width: 648px;
margin-right: auto;
margin-left: auto;
}
header {
color: #FFF;
}
#apDiv3 div h1 .h1 {
font-family: Arial, Helvetica, sans-serif;
color: #FFF;
text-align: center;
display: block;
width: 942px;
margin-right: auto;
margin-left: auto;
}
.sign {
background-image: url(file:///Macintosh%20HD/Work/Terry%20Cornelius/hallmarkauto_html/images/sign.png);
background-repeat: no-repeat;
text-align: center;
display: block;
width: 864px;
margin-right: auto;
margin-left: auto;
}
#apDiv6 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
}
.locations {
font-family: Arial, Helvetica, sans-serif;
text-align: center;
display: block;
width: 170px;
margin-right: auto;
margin-left: auto;
font-size: 20px;
}
#apDiv9 .heading2 {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv9 .heading2 {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv7 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv8 .locations {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
}
p {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.heading2 strong {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
}
#apDiv7 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
}
#apDiv7 .heading2 strong {
font-family: Arial, Helvetica, sans-serif;
}

Thank you sooooo much! You are so kind to do help me!!!!!!!

RE: CSS Anyone?


...couldn't get the posted link to work unfortunately the address seems to be unavailable...

...the background image in your case could do with being part of the wrapper div, which is centred and holding all the other content...

...here you can download a fixed version:

http://dl.dropbox.com/u/3753740/new.zip

...i would also recommend using the FREE firebug plugin as part of the firefox browser to help learn how sites are built, you can dig into the code of sites easier:

http://getfirebug.com/

...you can also use the developer tools built into safari or chrome that work similar to firebug allowing you to target areas of a page and make temporary edits before implementing them into your final CSS...  

andrew

============
  www.apepp.info
============

RE: CSS Anyone?

(OP)
Great info! Thanks!

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members! Already a Member? Login

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close