|
|
CSS question
|
|
|
|
HamSandwich
|
|
Hey everyone,
I have a CSS question. Look here:
CopyRight
Do you see that the difference between the border of the general page (the white one) and its content is not very big? Only a few pixels! I don't know the English word, margin or so... How can I change this with CSS? Can I increase this difference somehow? Twice as big would be not so bad, much better...
Thanks,
PeterParker
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
It looks fine to me. The logo is worse, the art is crashing the outline of the rectangle, and not in an intentional-seeming way.
but if you wanted to increase the padding, increase the padding here:
.everything {
background-color: white;
margin: 0 auto;
padding: 40px; <---------
width: 800px;
}
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
The logo isn't finished yet...
Thanks!
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
do your search on fixed position, and hidden overflow.
Do they have you use Firebug in your class? It is a good way to see what others have done.
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
No, no Firebug. I'm no trying. I found an article which told me how to create a fixed sidebar in the upper right hand corner. Not what I wanted.
I want a sidebar attached to the original content, to the body, in a way. I'll search "fixed position" and "hidden overflow"...
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Trying around for a while, I somehow managed to solve the problem. I just created two columns, one being fixed and having "float: left", one being the content-column that contains the website. It looks great and works perfectly!
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
I eventually managed to create my sidebar. Look here:
CopyRight
I now have a different question. How do I eradicate the distance between the top of the browser window and the top of the page? There's no over a cm difference, many pixels. Looks not so good. Any idea? Dunno how to code this...
Greetings,
PeterParker
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
Look at your class everything. What do you see?
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Okay, okay... Thx! I just changed the padding and now everything is alright. I didn't think like that, I thought the padding was the distance between the left and right borders and the body. Greetings... Nearly finished with my exercise, a webpage for a copy shop :-)
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Originally Posted by andi*pandi
Looks good!
Thanks? Thought you meant the whole website, not only the padding
Was four weeks of actual work. We built the elements in class - logo and photos in my case - and then added everything up, so that there is a finished web site. Building the page was a bit fast, but alright, did some new "programming" I hadn't done before. Programming might be an overstatement for CSS, but they call it that in class. So, let's see...
You can see the older versions by replacing the url's end through "studium5" or "studium4", these were the former versions.
Cool, I resolved most of my issues.
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Hey everyone,
I have a new problem, here:
Galerie
Apparently - when you look at it in Chrome -, the slider nav doesn't work, there are no left and right slider buttons. I didn't find the images, so I downloaded the example, but without the images, so... Where are they? It's from this website: SlidesJS Standard Code Example
The name could be something with "chevron".
I have another problem, apparently I can't resize the width properly. Whenever I do it, it changes the height, too. I didn't want any resizing anyway and thought I would just use properly resized images from Photoshop. So...
Any help?
Greetings,
Parker
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
have you studied web fonts yet?
and if you are not being taught firebug or developer tools, you should look into it. very helpful tools.
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Well, hey andi-pandi... you a web designer, right... So, I just took a short class which was entitled "HTML course" and which was really a class on CSS and some galleries with jQuery... So, we didn't learn much about Firebug or Developer Tools. I don't know when I'm going to get in touch again with all of this, but maybe only in a few years. I just wanted to build this gallery with navigation controls, so I could use it on the website of my parents.... Just for me, for fun really... I checked, and it's this class "chevron right" and "left" etc. and there's a note in the one CSS file, but there isn't a link anywhere... What to do? Wrong gallery?
I might as well pick a different gallery...
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
Hi Peter, I am trying to give hints without doing your homework for you. I'm not sure how your teacher could have taught you css without Firebug, it is really instrumental in seeing how others have built their sites, and for testing your own sites.
The chevron is a font icon from Font Awesome. Did you install the webfont on your server, or link to Font-Awesome directly?
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Hey...
no, no homework... Last day of studies for the semester was three weeks ago. This is for my mum's website. I had hoped you can use this slider for commercial use, too, to be honest. The site is www.designbooks.de, which is already cool, bilingual, with some scripts and a nice look, but it lacks a gallery with more information on the books. So, I wanted to use this slider which is also great on iPad - so, the website is great on iPad in landscape mode - and which works well, with animation, on the Mac. I have some problems, though... I don't know about the arrows for previous and next and I have some problem with width and height, although I dunno if the latter is so important, I wouldn't want to resize images, anyway, I'd just use original images which I'd crop in Photoshop, so they would already have the same size. So, the arrows might be all my problem, other than that, the gallery is cool
Thanks already...
Peter
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
You can use the slider, for the icons just put the link for the webfont FontAwesome in your site header. Read more here:
Font Awesome, the iconic font and CSS toolkit
I've never used this particular carousel before, but if you are having issues with sizing, perhaps the carousel is trying to resize images responsively for you.
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
hey... still awake?
Now, the arrows are there! I installed the whole font-awesome directory, somehow... It still says "Previous" and "Next" when I try... huh? Why would it do that?
Here: Galerie
Weird...
Thx for all the input, though, looks pretty nice already...
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Hey andi*pandi
Look here: Galerie
It doesn't really work, you see? I think I'll go with another gallery. This was the gallery they taught us in class, and, as you see, they didn't really tell us how to use it if you wanted to use all the buttons and really integrate it into your website... So, I'll pick a different one I can handle on my own
Thanks for all the input. It's important to me to get a cool slider into it, so the website should work great on an iPad and everything. At least, there's a good general direction, but it seems to be some work
Greetings!
Peter
|
|
|
|
|
|
|
|
|
Moderator
Join Date: Jun 2000
Location: inside 128, north of 90
Status:
Offline
|
|
Sorry Peter, I was on vacation.
You can try another gallery, but you were almost there with this one. Up to you!
|
|
|
|
|
|
|
|
|
HamSandwich
|
|
Good vacation?
No, no, I just went with another one. I was looking for a really simple one with a swipe-effect on an iPad. So, this is what I have done:
http://daten.design-books.de
Then click on "More", just have a look :-) The images are not so well picked yet, but other than that, everything is really great. The gallery is cool and was easy to integrate.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Forum Rules
|
|
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
|
HTML code is Off
|
|
|
|
|
|
|
|
|
|
|
|