Alignment, margin, padding

  • tarushka · Member ·

    Hi,

    Here’s what I’m trying to do with the look of my blog. It’s the Twenty Ten theme:

    1. Align the #wrapper to the width of the header image, so that the navbar looks like it’s entirely part of the green background
    2. Flush the header image to the very top of the page to hide the part of the #wrapper above it.
    3. Re-align all the text, since it will probably be cut off from the above two modifications.

    How would I go about doing this using CSS only? Cannot do Php in the WP version I’m using and I wouldn’t want to touch it anyway!

    Thanks!
    T

    The blog I need help with is: (visible only to logged in users)

  • tarushka · Member ·

    Sorry, the URL is tarushka.wordpress.com

  • thesacredpath · Member ·

    The site linked to your username has been deleted. We need a link to the site you are talking about.

  • timethief · Member ·

    Is this the blog in question? http://tarushka.wordpress.com/

  • timethief · Member ·

    Id it is may I suggest that you remove the link to the dead blog linked to your username and link your username to the active blog instead? Dashboard -> Users -> Personal Settings -> then scroll down to Account Details. Then scroll down to where it says ‘Website‘ select the URL for your primary wordpress.com blog and then save changes.

  • thesacredpath · Member ·

    Give the following a try and see what you think.

    #wrapper {
padding: 0;
}

#header {
padding: 0;
}

#site-title, #site-description {
display:none;
}

#container {
padding-left: 10px;
padding-right: 10px;
}
  • tarushka · Member ·

    Thanks ppl. Yes, the site is http://tarushka.wordpress.com/ It should not be deleted.
    I will try your suggestions later and let you know how it worked out.

  • thesacredpath · Member ·

    If it isn’t exactly what you are looking for, just let us know and we will get there.

  • tarushka · Member ·

    Hi,

    I just changed the wrapper margin and padding to 0 and it does the trick so far. Just need to get rid of the light coloured wrapper above the header image, so I’ll try the other tags you gave my Sacredpath.

    Now I just want to change the navbar link font colour to the same color as the wrapper, and that’s about it. What I’m really fighting with the most actually is the font size and type for the body text. I can’t seem to make it smaller or larger or change the font type. Then again, I’m cutting and pasting text from another site, so I have to take out all the codes from that first, but that still doesn’t seem to work. And I don’t understand how TypeKit works. I log into it and get a blank page.

    I like that the blog is hosted by WordPress. This way I don’t have to deal with PhP. My actual web site is designed with WordPress and hosted by Bluehost: http://www.putintowords.ca

    You guys rock!
    T

  • tarushka · Member ·

    On that note, it would be great to find books and website about WordPress and CSS with different takes on themes. I’ll be checking out my local bookstores in Montreal. I’m sure someone has brought up this topic before.

  • thesacredpath · Member ·

    The reason I included this,

    #site-title, #site-description {
display:none;
}

    was so that you could go back to settings > general and put in the site title and tagline, which are important for the search engines. Right now with them blank, the search engines do not know the name of your site since they cannot read text in a header images.

    With them set to “display none” they are not visible on the site, but the search engines can see them.

  • thesacredpath · Member ·

    You are welcome by the way.

    On wordpress, because of the short development cycle, books can become obsolete in a very short period of time, and I know of none on working CSS with wordpress. That really is pretty much the same with anything. Here is CSS in a nutshell:

    atthe404 on CSS:

    There is no trick. But doing CSS requires an understanding of the markup (xhtml). There is no way round that. The CSS applies styles to stuff. To what stuff depends on the markup. So number one read the source (View Source). Get used to it. Feel comfortable with it. Two. Understand what the heck selectors actually are. Different cats of selectors behave in different ways. SO: this is counter intuitive. To understand the CSS do not start in CSS. Start in the xhtml. Then see how they relate. Its all there. :)
    There are gazillions of CSS tutorials on line.

  • tarushka · Member ·

    Hi,

    Thanks Sacred for the site-title site-description advice. My site doesn’t actually have a title right now, and that’s ok for the time being, because I’d eventually migrate this site to another URL with a host or create a new blog via WordPress with organization name in the URL. I need to make sure the president approves this site first. Otherwise, I will set the blog to private and just use it as part of my portfolio.

    Now I’m having footer issues, which I described in another post.

  • thesacredpath · Member ·

    You are welcome, and I’ve answered your other query also.

  • The topic ‘Alignment, margin, padding’ is closed to new replies.