Erledigt - Abstand auf rechter Seite - woher kommt der?

[Sargas]

Hi Leute,

ich schraube grade etwas am Theme meiner Webseite rum (auf einer Testinstallation von Wordpress). Jetzt hab ich aus irgendwelchen Gründen einen Abstand am rechten Rand, wenn ich den Browser zusammenschiebe, sodass ich einen Scrollbalken bekomme. Findet irgendwer die Ursache dafür? Ich such mir hier den Wolf...

Hier zum Gucken

Danke!

 

[Chris_EDI]

Mit Chrome auf dem Mac kann ich es nicht nachvollziehen. Kannst du einen Screenshot machen?

 

[TPHeinz]

Moin,

mit Firefox habe Scrollbalken seitlich und unterhalb.
Bei Fehlern lasse ich immer den W3c Validator laufen der auch Fehler anzeigt.

1. Error: style element between head and body.
   
   From line 98, column 1; to line 98, column 7
   
   </head>↩<style>↩ #
   
   
2. Fatal Error: Cannot recover after last error. Any further errors will be ignored.
   
   From line 98, column 1; to line 98, column 7
   
   </head>↩<style>↩
   
   nach Bauchgefühl liegt das Problem in deinem Footer / Suchfeld

 

[AliceG]

Hi Sargas,

gib doch deinem div mit der Klasse "social-menu" zusätzlich overflow:hidden
Das sollte erstmal dein Problem lösen.

Nachtrag:
Noch besser wenn du overflow:hidden dem a Tag innerhalb von social-menu verpassen würdest und nicht dem ganzen social-menu container.
Denn das Problem verursachen die a Tags. Die sind zwar mit Breite von 30px definiert aber dort enthaltene Texte sind länger als das.
Ich setze solche Texte normalerweise in ein span Tag mit der die klasse sr-only. Diese klasse ist dann auf display:none. So kann ich dem a Tag :before oder :after nach belieben definieren/stylen. Der a Tag ist dann immer relative und die pseudo Klassen :after oder :before sind dann auf display:block position:absolute und die gewünschte Breite und Höhe.

LG,
Alicja

P.S.
Man sollte die Icons als Fonts eigentlich vermeiden ;-)
http://t3n.de/news/svgs-ftw-keine-icon-fonts-678232/
Dann schon lieber eine Sprite svg Datei mit der man ganz regulär die Icons als Background definieren kann.
Noch besser sind natürlich die Inline svg's aber das muss man noch mit eine CallBack Funktion für IE machen. Es sei denn, man will nur noch Edge von Windows berücksichtigen.

 

[Sargas]

Danke euch. Es hängt wohl an dem Menü mit den sozialen Netzwerken. overflow: hidden ist zwar nett, aber auf dem Smartphone kann ich trotzdem die Seite nach links verschieben.

Edit: Sorry @AliceG, du hast natürlich Recht und ich hab grade auf dem Schlauch gestanden... Jetzt passt das alles. Danke!