4 replies [Last post]
kevb8ll
kevb8ll's picture
Offline
newbie
Last seen: 2 years 21 weeks ago
Timezone: GMT+1
Joined: 2011-11-29
Posts: 8
Points: 11

I am reworking my site. I have a clone to try and suss the css out. I have done most of it, but the header image has a white thin line at the end of it on larger screens.

The image is uploaded as an option within the theme, I have cropped it to the correct size but somehow doesn't go fully across.

I have temporarily changed the menu background colour the same as the header so you can see the issue. I have tried using css plug in in FF but can't suss it. If anyone can help I would appreciate it.

http://www.joysandsorrows.co.uk/newblog/

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 10 hours 16 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9714
Points: 3790

Ugh

Unfortunately, you're trying to use a theme that is incredibly badly written. There are eight stylesheets that are mostly redundant to one another and ten scripts that I have no clue what value they add for the visitor. (Updates? Wait until all else is done before adding bells and whistles.) Plus, the embedded style sheets and scripts.

Yours is a simple, straightforward layout that has been made complex and difficult to debug and maintain; presumably to make potential purchasers reel in shock and awe of how bright the vendor is. Not.

The basic layout structure is poorly done. It more or less requires each element to be sized to fit. Plus, by floating elements unnecessarily and using the bastardized 'clearfix' hack, things get even more screwed up. Clearfix was sheer genius when first implemented a dozen years ago. Since then, we have learned a potload about how to enclose float elements (written in 2006). Even so, nearly all theme and foundation writers keep throwing in the clearfix class on any and everything. In this case (and I'm not sure if I'm seeing the same thing you are), delete the clearfix ruleset from the banner container and remove the float property from the image and/or its container.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

kevb8ll
kevb8ll's picture
Offline
newbie
Last seen: 2 years 21 weeks ago
Timezone: GMT+1
Joined: 2011-11-29
Posts: 8
Points: 11

I've attached a screen shot

I've attached a screen shot to demonstrate what I mean.

At the right edge of the header compared to the main menu, you will see there is a column of white 1/2px wide. Interestingly enough, in chrome, if I zoom in once, it looks even.

Looking at it again, I'm not sure if it is the header or the menu block that is causing it. I have tried all sorts, but I just can't work it out.

Gary would you be so kind as to be able to offer me some further guidence please. I am REALLY frustrated here.

The company offer support, but only for bugs. They don't give ANY help on customising their css which is pretty crap if you ask me. However I am already committed to this theme now, as I have paid for it.

Many thanks

AttachmentSize
Screen.png 20.62 KB
kevb8ll
kevb8ll's picture
Offline
newbie
Last seen: 2 years 21 weeks ago
Timezone: GMT+1
Joined: 2011-11-29
Posts: 8
Points: 11

What a dumbo! I've fixed

What a dumbo! I've fixed it.

My header image was 1px short in width. REALLY sorry messing you about!

Madhukarwd
Madhukarwd's picture
Offline
newbie
Bangalore
Last seen: 2 years 15 weeks ago
Bangalore
Timezone: GMT+5.5
Joined: 2016-07-21
Posts: 2
Points: 2

Hey! Add this code to your

Hey!

Add this code to your CSS file I hope it will work.

.main-navigation {
margin-top: 10px;
}

.site-content {
margin-top: 10px;
}

body.home .entry-content p {
margin-bottom: 10px;
}

.entry-content img {
margin: 0px;
}