Малък проблем с тема

asenlevov

Member
Здравейте, днес някак от нищото буквално ми се появи един проблем. Разбирам от CSS, но не мога да си обясня този проблем. Дори опитвах да редактирам файла и да пробвам неща с padding 0, но все още модула за случайни новини ми стои с 30 пиксела надолу.

7815909B.jpg

Ако някой от вас прецени, че може да се справи, би било супер.
Ето ви малко код от CSS файла (за top menu и специално за breaking-news модула)

Код:
/* Top Menu Styles */
.top-nav {
	background:#2c2c2c;
	border-bottom:4px solid #cd2122;
	height:30px;
	z-index: 3;
	position: relative;
}
	.top-nav .menu-alert{
		float:left;
		color:#666;
		padding:8px 0;
		font-style:italic;
	}
	.top-nav ul {float: left;}
		.top-nav ul li {
			position: relative;
			display: inline-block;
			float: right;
			margin-left:20px;
		}
		.top-nav ul li a, .top-nav .breaking-news a {
			display: inline-block;
			height: 30px;
			line-height: 30px;
			color: #ccc ;
			padding:0  ;
			text-shadow:0 1px 1px #000;
			font-size: 12px;
		}
		.top-nav ul li a:hover, .top-nav .breaking-news a:hover {color: #FFF;}
		.top-nav ul ul {
			background: #2c2c2c;
			display: none;
			padding:0;
			position: absolute;
			top: 30px;
			width: 180px;
			z-index: 99999;
			float: left;
			-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
			-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
		}
			.top-nav ul ul li {background: none !important;border: none !important;z-index: 99999;min-width: 180px;}
				.top-nav ul ul ul {right: auto;left: 100%;top: 0;z-index: 99999;}
			.top-nav ul ul a {
				background: none !important;
				height: auto !important;
				line-height: 1em;
				padding: 10px 10px !important;
				width: 160px;
				display: block !important;
				margin-right: 0 !important;
				z-index: 99999;
				color: #ccc!important;
			}
			.top-nav ul ul li.current-menu-item:after{display: none;}	
		.top-nav ul li:hover > a,.top-nav ul :hover > a ,.top-nav ul li.current-menu-item a { color:#fff;}
		
	.top-nav ul ul li:hover > a,	.top-nav ul ul :hover > a {color: #fff !important; padding:10px 5px 10px 15px;	}
	
	.top-nav ul li:hover > ul {display: block;}

Код:
/* Breaking News */
.breaking-news{
	float:left;
	height:30px;
	position:relative;
	overflow:hidden;
	min-width: 55%;
}
	.breaking-news span{
		background:#cd2122;
		display:block;
		float:left;
		padding:0 10px;
		height:30px;
		line-height:30px;
		color:#FFF;
		font-family: Oswald,arial,Georgia, serif;
		text-transform: uppercase;
		font-size:10pt;
		margin-right:10px;
	}
	.breaking-news ul{float:left;}
	.breaking-news ul li{display:none}
	.breaking-news ul li:first-child{display:block}
	.breaking-news ul a{padding:8px;display:block;white-space:nowrap;}


Целта ми е това, както си беше преди:
7815921g.jpg
 
От: Малък проблем с тема

Проблемът е решен.

Поне при по-големите резолюции. При по-малките такива процентната минимална широчина на въпросния модул ще се окаже в повече поради факта, че тази на дивчето с иконите на социалните мрежи и тази на търсачката ще си останат фиксирани и непроменени, което ще доведе до същия нежелан ефект поради липса на достатъчно пространство за всички.
 

Горе